Blogger初心者でもコピペで簡単。ブログに目次を設定する方法

2020/07/25

Blogger Bloggerカスタマイズ

こんにちは、Blogger女子見習いのkarafuruです。
Bloggerを使い始めて、1ヶ月が過ぎようとしています。

今日は、ブログに「目次」を設定するカスタマイズです。

・・・といっても、今回はまさに「コピペ」。
このブログの王道と言ってもいいほど、いさぎよくコピペです。


ブログに目次を作るメリット・デメリット



すっきりしたデザインの多いBlogger。
おかげで、とても読みやすいブログが作れます。

読者目線でいいですよね。

でも、アレがない。
読者にとって有効な、アレがない!

目次です。

ブログを書く際には、見出しなどを使って読みやすくしている方がほとんどだと思います。

その見出しを並べて表示することで、いわゆる本の最初についているような「目次」になります。

目次があるメリットは、

・内容を把握しやすい
・読みたい場所を見つけやすい
・SEO対策しやすい
・書き手も記事を書きやすい

まさに「~やすい」ことだらけ。

逆に、目次があるデメリットは、

・項目が多過ぎると、見た目が悪い
・項目が少なすぎると、見た目が悪い
・目次を利用しない場合、邪魔

うん。
実はわたしも、ひとのブログを読みに行った際には、あまり目次を利用しません。

本文を先に読みたいので、目次は完全無視です。

そういった場合、あまりたくさん項目が並んだ目次だと、存在感がありすぎて、はっきりいって邪魔
スクロール、めんどいなあ・・・と思っちゃう。

このメリット・デメリットを考えたとき、一番わたしの考えにしっくりくる方法として思いついたのがこちら。

・目次は作る
・でもできるだけ、初期表示は小さくする
・読者の好みに合わせて大きく表示できるようにする

これなら、目次の「イイトコ取り」
でも、そんな都合のいい「目次」作れるのでしょうか?


コピペで目次を作成



はい。
そんな都合のよい、目次の作り方を教えてくださっているサイトがありました!

じゃん!!
ここです。



たぶん、Bloggerでブログを書いている方は、この方のブログに一度は足を運んでいることと思います。
それだけ、分かりやすく、かみくだいて、親切な説明をされているブログです。

目次に関して言うと、

・完全にコピペで対応可能
・カスタマイズも可能
・カスタマイズ例もたくさん載っている
・導入しても軽い

と、いいことづくめ。
本当に、大変大変お世話になりました。


このブログでのカスタマイズ



まずは、上記ブログからコードをコピーさせていただき、HTML編集の画面にペタリと貼りました。

その上で、自分好みに変えています
変えるって言ってもね、書いてあることをそのままなぞっただけのことで。

はい、簡単です。

なおHTMLをいじるので、いつでも後戻りできるようにバックアップを取っておいてくださいね。
もう、これ必須。
初心者は、すぐ泣きそうな状況に陥るので、バックアップしておくに越したことはありません!!
・・・わたしがそうなので。

形式を「鮮やかなドット枠の目次」に変更

スケ郎様のブログに掲載されています

色を自分のブログの色に合わせて変更

Bloggerで設定している、自分のブログのブランドカラーを基準にするとスッキリします。

autoNumberをfalseに変更

これにより、目次に番号が振られなくなります
完全に好みの問題ですよね。

showTocをfalseに変更

これにより、目次が閉じた状態で表示されます。
つまり、読者が自分で見るか見ないかを決められるので、わたしのように目次を使わない人間にとってもウザくない気がします。

widthを100%に変更

これにより、目次の枠がブログの横幅と同じ大きさになります。
こちらの設定も好みだと思うのですが、スマホ画面で見た際に、幅が横幅に合っているとスッキリ見える気がしたので、変更しました。


といった5ヶ所だけ、チャチャッと変えました

実際にできあがったのが、今ブログに表示されている目次です。

邪魔じゃないし、かわいい。
とても気に入っています。

色を変えるだけで、ずいぶん違った印象になります。
変更する部分は多くないので、やり直しも面倒ではありません。
好みに合わせて、いろいろ試してみて下さいね。

最後までお読みいただき、ありがとうございました。
この記事が、何かのお役に立てば幸いです。

〇 自己紹介 〇

自分の写真
はじめまして。
Blogger初心者のkarafuruです。

ユーザーのみなさんの情報に助けられながら、ゆっくりと自分らしいブログを作っていこうと思っています。

保育園に通う男の子と女の子を育てる、のんびりしたワーママです。

根っからの文系なのに、10年以上IT業界で働いていて、元ナレーターというちょっと異色の経歴を持っています。

楽しみながらブログを続けていきたいと思っているので、どうぞ、よろしくお願いします。

▶Bloggerカスタマイズブログ
「Blogger女子」

▶RPA学習
「文系女子の世界一ゆるいRPA学習日誌」

QooQ