Blogger Labo：【Blogger】シンプルテンプレートのセレクタ一覧表

Bloggerのシンプルテンプレートをカスタマイズする時に使うセレクタを一覧表にしました（基本的に自分用）。

他所からダウンロードしたテンプレートにも応用が効くことがあるので参考にしてみるといいかも。

※カスタマイズ詳細については「こちら」の記事を参照


記事ページ



項目セレクタ備考
記事タイトル（h1）
.entry-title{}
h3.post-title{}
見出し（h2）.entry-content h2{}
小見出し（h3）.entry-content h3{}
準見出し（h4）.entry-content h4{}
文章（標準）.post-body {}
画像.post-body img{}「padding:0;」で余白削除

コメント



項目セレクタ備考
コメント見出し.comments h4{}「*件のコメント」「コメントを投稿」に影響
コメント部分全体.comments{}
コメント欄
.main-outer p{}
.comments-content{}
返信欄.comment-replies{}投稿のフッターの背景色と連動
返信欄のリンク.continue{}「返信」「コメント欄を追加」のリンク文字に影響
コメントの境界.comment-block{}

サイドバー



項目セレクタ備考
サイドバーの見出し.sidebar h2{}
サイドバーのコンテンツ.widget-content{}全体の文字サイズは「font-size:数値%;」で設定
人気の投稿#PopularPosts1{}

フッター



項目セレクタ備考
フッター全体footer{}.（ドット）は要らない
フッターの見出しfooter h2{}

ページナビ



項目セレクタ備考
「前に戻る」ボタン#blog-pager-older-link{}リンクの場合は「#blog-pager-older-link a{}」
「新しい投稿」ボタン#blog-pager-newer-link{}リンクの場合は「#blog-pager-newer-link a{}」
「ホーム」ボタン.home-link{}「.home-link{display:none;}」で非表示
「Atom」の表示.feed-links{}「.feed-links{display:none;}」で非表示

モバイル



項目セレクタ備考
記事タイトル
.mobile .entry-title{}
.mobile h3.post-title {}
トップページの要約html .mobile-index-contents .post-body {}
文章（標準）
.mobile .post {}
.mobile .post-body {}
「前に戻る」ボタン.mobile #blog-pager-older-link a{}
「新しい投稿」ボタン.mobile #blog-pager-newer-link a{}