Blogger「Tokyo」パンくずリストの文字を小さくする方法

Bloggerの日本語対応テンプレート「Tokyo」でパンくずリストの文字を小さくする方法です。

「Tokyo」のパンくずリストは下の赤枠の部分の部分です。

赤枠の部分が「Tokyo」のパンくずリストです。

このパンくずリストの文字が何となく大きい気がしたので、もう少し小さくしてみることにしました。

このカスタマイズは、テーマのHTMLにコードを直接付け加える方法なので、一応中級者向けとしています。

ですが、簡単なコードを付け加えるだけなので、貼り付ける場所さえ間違えなければ初心者の方でも簡単にできると思います。

それでは、さっそくやってみます。

Blogger「Tokyo」パンくずリストの文字を小さくする

まず、Bloggerの管理画面でテーマをクリック後、右端の赤丸で囲んだ部分をクリックします。

次の画面が開くので、「HTMLの編集」をクリックします。

「HTMLを編集」をクリックします。

HTML編集画面がひらくので、左端の数字が500番台になるまで画面をスクロールします。
※「breadcrumb」がパンくずのことです。

下の赤枠の所にコードを付け加えます。（※実際の画面に赤枠はありません）

赤枠の所にコードを書き加えました。

※左端の数字は多少前後する場合があると思いますので、必ず青字の内容をよく見てください。

付け加えたコードはこちらです。

font-size:80%;

%の数字はお好みで変えてください。ちなみに80％だとこうなります。

＊before

元の文字サイズです。

＊after

80%の文字サイズです。

これでタイトルとのバランスがよくなったと思います。

コードを書き加えた後は、必ず「保存」のマークをクリックしてください。

コードを書き加えた後は、「保存」のマークをクリックします。

これで、パンくずリストの文字を小さくする方法は終了です。
おつかれさまでした＊

▼こちらもおすすめ♪

→ホームへ戻る