【Blogger】カスタマイズの参考リンク集【QooQ】

Bloggerカスタマイズ

私がこれまでBloggerカスタマイズの参考にさせていただいたサイトのリンク集になります。いわゆる備忘録的な記事です。

みなさんの参考になれば幸いです。
※編集前にはバックアップを取ってくださいね!

目次

目次の自動生成

WordPressには標準搭載されている目次の自動生成機能ですが、Bloggerにはそういった機能がなくてびっくりしました。
Blogger界隈ではスケ郎さんのコードがよく使われている印象です。

私はCSSの調整が上手くいかなかったため、リモスキさんのコードを使わせていただいています。ページ(サイトマップ)にも使用することができて大変重宝しております。

ページトップへ戻るボタンの作成

右下に出ているオレンジ色のボタンです。押すとページの一番上まで自動スクロールされます。いろんなブログを見ていて、必ず実装したいなと思っていたカスタマイズのひとつです。

プロフィールカードの作成

こちらはBloggerのカスタマイズを探している時に偶然見つけたものです。この方のプロフィールカードめちゃくちゃかわいい!と思ったらコードを公開されていたので真似させていただいています。楽天ROOMもつけちゃいました。

HTMLを[レイアウト]にある「HTML/JavaScript」ガジェットにコピーして貼り付けて、CSSを[テーマ]>[HTMLの編集]から</b:skin>の直前に貼り付けるだけ!簡単!!

ページネーションの作成

記事一覧の下に出るあれです。①・・・⑤みたいなやつ…伝わりますか?QooQは前後のページを移動する[前の投稿]と[新しい投稿]ボタンしかないので導入しました。大満足です。

アイキャッチの表示形式

人気の投稿の画像形式を正方形から長方形にしてみました。同じアイキャッチなのに記事によってトリミング位置が異なるのが気持ち悪かったので、いっそ全部表示されるようにしたいと思っていたところ、こちらの方法に辿り着きました。

関連記事の画像形式も丸から長方形にしました。人気の投稿と同じようにアイキャッチを全て表示させたくて、地味にこだわった部分です。

囲み枠やオーダーリストのデザイン

当ブログではオレンジのシンプルな囲み枠デザインを使用しています。サルワカさんは他にもブログに使える様々なアイテムのデザインを掲載されていますので、ぜひ参考にしてみてください。

オーダーリストのデザインです。丸数字がよかったので環境依存文字を使用することにしました。



自分の写真
りり
詳しく解説してほしいカスタマイズがあったらコメントください。記事にします!

QooQ