年末の余暇を利用して、当Blogのテンプレートを「QooQ」から「F-light」へと変更しました。
特に「QooQ」に不満があったわけではないので、気分転換も兼ねての変更で、デザイン自体は以前とほぼ同じ形にしました。（あくまで現段階、ラベルのハッシュタグ化が不十分だし…）
基本、テンプレートとの差分を見れば済むことですが、カスタマイズ項目の一部をザックリ覚え書きしておこうと思います。
トップページの 1カラムレイアウト化
「個別ページ」手前の「1 カラム レイアウト」部分のCSSコードを「記事一覧」手前にコピーし、一部数値変更。
記事一覧の4列表示
変更箇所がそこそこあるので、ソース参照。（主に「記事一覧」部分のCSS）
個別ページの２カラムレイアウト化
「記事一覧」手前の「2 カラム レイアウト」部分のCSSコードを「個別ページ」手前にコピーし、一部数値変更。
トップページ以外のウィジェット表示化
個別ページ等に表示する各ウィジェットの html 部に「cond='data:view.isSingleItem'」を追記。
個別ページのタイトルの装飾
ブログ名同様、該当部分のCSSに「first-letter」要素を追記。既存部分も若干変更。
トップページの投稿数を12件に変更
「ふじろじっく」様の「Blogger Theme F-light (エフライト) について」記事参照。
トップページのスニペットを削除
「ふじろじっく」様の「F-light カスタマイズ集 (随時追加予定)」記事参照。
トップページの日付をラベルと同様の表示方法に変更
「記事一覧」部分のCSSコード末尾の「.article-category」を参考にし、「.article-header」部分を追記。
※ 注目の記事や人気の記事にも反映されてしまうため、各ウィジェットを利用する場合は、両者ともカードレイアウトのデザインにするか、もしくは…
サイトマップ
「ふじろじっく」様の「【F-light】カスタム サイトマップ & 最新コメント ウィジェット (ダークモード対応 CSS 付きコード)」記事参照。
記事中の囲いCSS
「BloggerMaster！」様の「bloggerカスタマイズ！記事中に目立つ囲いをつくる！」記事参照。
以上！
コメントを投稿
別ページに移動します