マテリアルぽっぷスマートフォン用の表示で見るマテリアルぽっぷはてなブログテーマ「マテリアルぽっぷ」のデモサイト。最新カスタマイズ情報やバグの修正情報など掲載していきます。HomeProfileArchivesPolicyMail2020-05-03テンプレート「マテリアルぽっぷ」の説明と注意点テーマに関してテーマコンセプトについて影とか浮き上がって見えるようなマテリアルデザインをコンセプトに、それっぽい感じに作っています。作者自体久しぶりに本格的にコードに触れたので不具合が出ている部分もあるかと思いますので、もし発見された方はご連絡いただければと存じます。作者が都合の良いように良いように作っているので、CSSの表記がおかしな部分も多いかと思いますが目を瞑っておいていただければと・・・。テーマ「マテリアルぽっぷ」については、基本的にははてなブログpro用に作っています。TOPページの表示方法に関しては一覧表示にした場合、カード型のデザインになるように設計しているので、基本的に全文表示ではなく一覧表示を推奨いたします。TOPページの表示についてグリッドレイアウトを使用してスタイルシートを書いています。TOPページのPCは3カラム、メニューはページ下部でこちらも3カラム。タブレットは2カラム。メニューはページ下部で2カラム。メニューはページ下部で1カラム。なるようになっています。grid;」が設定してある部分をちょいちょいイジると出来ると思うので、色々やってみてください。PC表示で3カラム、タブレット表示で2カラムになるため、TOPページの記事表示数は偶数と奇数が重なる6か12記事がベターです。(個人的には12がオススメ)TOPページのカテゴリ表示について一覧表示をした際に、表示される記事のカテゴリについて、最初に選択した1つのみ表示するように設定してあります。カテゴリ2を先に選び、カテゴリ1を次に選んだ場合、TOPに表示されるのはカテゴリ2のみになります。その他カスタマイズについては、別途他記事を参照ください。ヘッダーやフッターのデザイン変更方法を記載しております。2018/6/18更新カスタマイズ追加事項があれば随時追加。サムネイルの設定について一覧表示にしている場合、記事を投稿する際にサムネイルの設定を必ずしてください。しない場合、表示が若干うまくされません。サムネイルの画像がない場合は、デフォルトのものをご使用ください。パンくず設定についてパンくずの表示設定をオンにしていない場合、記事ページのヘッダーと記事部分が以下のようにくっついてしまいます。以下のようにパンくずリストという項目があるので、オンにしましょう。してもパンくずをつけたくない!という方は、以下のコードをカスタマイズCSSに追加しましょう。2018/6/18更新Tweet広告を非表示にするコメントを書くもっと読む2018-07-13PC版TOPページを記事のみ3カラムから、メニュー有りの3カラムに変更する方法カスタマイズこの記事ではPC版TOPページを記事のみ3カラムメニューから、メニュー有りの3カラムに変更する方法をご紹介します。なんだか文章だと伝わりにくいので、図解すると以下のような感じです。以下のコードをデザインCSSにコピペするだけ。!important;}}あまり検証していないので、もし崩れたらごめんなさい。13:41PC版TOPページを記事のみ3カラムから、メニュー有りの3カラムに変更する方法Tweet広告を非表示にするコメントを書くもっと読む2018-06-28QA&不具合報告用記事QAテーマについて質問や不具合を発見された方はこの記事にコメント下さい。不具合の報告に関しては、不具合の状況を教えていただければと・・・。質問される際の注意点として・ブログのURL・どの部分がどんな挙動になっているのか具体的に上記2点は必ず教えてください。実際に見てみないと、想像だけでは具体的な対処方法の提示ができかねるので。他の方が公開されているHTMLやCSS、JSなどのコードを追加し、表示がうまくいかない場合については対応外とさせていただきます。しても・・・という場合は、ココナラもしくはBaseにて有料で対応するサービスの専用カートを作成しますので一度ご相談ください。上記の対象外のコメントについては承認せずスルーします。17:02QA&不具合報告用記事Tweet広告を非表示にするコメントを書くもっと読む2018-05-30見出しや装飾の見本カスタマイズ目次はこんな感じ↓これがH2の設定これがH3の設定これがH4の設定h5は未設定。基本H3ぐらいまでしか使わないよね。これがH2の設定これがH3の設定これがH4の設定h5は未設定。基本H3ぐらいまでしか使わないよね。ホバーすると下線が出ます。ボールドはこんな感じ。