てふてふさんぽ 
スポンサーリンク
今まで使っていたテーマの「CONTENS」もとても使いやすかったんです。
グローバルメニューとか対話形式、カエレバ・ヨメレバも適用済みだったり細かいCSSカスタマイズもあってとてもありがたかったのですが、
流行りのカード型レイアウトにしてみたくなったんです。（*´・∀＜）
はてなブログのテーマにはカード型レイアウトのものがいくつかあります。
ちなみにこちらのブログでオススメのカード型レイアウトのテーマが紹介されてます。
まぁこれを見て、よし「カード型に変えよう！」と思った部分もあります。
「ZENO-TEAL」がすごくいいなと思ったのですが、全記事に「続きを読む」の設定が必須なんですよね……
絶対に設定を忘れる自信があるので……
「続きを読む」の設定が必要のないものから選びます。
で、「マテリアルぽっぷ」か「UnderShirt」かで悩んだのですが、
「UnderShirt」のシンプル・スタイリッシュなデザインより、ポップな感じの「マテリアルぽっぷ」の方が合うかなぁと「マテリアルぽっぷ」のテーマを導入させてもらいました。
はてなブログのテーマを変更すると、「デザインCSS」に入れていたものがバッサリと消えてしまいます。
そうなるととっても悲しいのでテーマ変更の前に必ずバックアップはとっておこうね。
まぁ「CONTENS」がほんと、痒い所に手が届くくらい色んな部分がすでにCSS適用されてたので、たいしてバックアップ取るまでもなかったんだけど。
「マテリアルぽっぷ」をインストールしたら気になる箇所をカスタマイズして行きます。
あと記事を一覧形式にしてる場合は「サムネイル」の設定が必須です。
他にもパンくずの設定をオンにしておきましょう。
このあたりの設定は「マテリアルぽっぷ」のデモサイトに載っているので必ず確認しよう。
「マテリアルぽっぷ」をインストールしただけだと、デフォルトではTOPページの記事一覧表示が３カラムになっています。
そしてプロフィールや最新記事などのサイドメニューは記事一覧の下に表示される形になっています。
これを記事一覧２カラム＋サイドバーの、要するにサイドバーありの３カラム表示に変更することもできます。
そのやり方もこちらの記事で紹介されてます。
CSSのコピペ一発で完了です。簡単。
「マテリアルぽっぷ」のデモサイトを見ると、左上にツイッターなどのアイコンが表示されてます。
この辺の表示の設定と、ヘッダー下のグローバルメニューなどのカスタマイズ方法はこちらの記事を参考にちまちまと設定しました。
せっかくなのでこの機会にちゃんとグローバルメニューを設定しようかなと。
あまりに記事が取り止めなさすぎてメニュー項目に悩んでますが……
TOPページに表示される記事一覧のサムネイルが、デフォルトのままだと正方形にカットされてしまい、あまり見た目がキレイじゃありません。
そこでこちらの記事で紹介されているコードを使うといい感じになります。
ちょっとした修正は必要です。
カエレバ・ヨメレバはCSSを設定してあげないとデフォルトのままの表示になってしまいます。
それだとちょっとやっぱり、わかりにくいし見た目もあれなんでCSSで整えてあげましょう。
このあたりの記事がほんとにとっても参考になります。
いやほんとありがたいです。
「つばさのーと」さんがカエレバ・ヨメレバのCSSジェネレーターを作成されてます。
めっちゃ便利です。すごい。
このあたりまで設定してチカラ尽きました……
早いなっヾ(- -；)
あとは暇暇にちょっとずつカスタマイズしていきます。
表示崩れとかないかの確認がてら過去記事も見直そうかな。
まずはヘッダーの画像を作るぞ٩( ᐛ )و
