【ブログ豆知識】見出しを目次に反映させる方法【Cocoon編】

ブログ運営
スポンサーリンク
管理人
管理人

小見出しが目次に表示されない(泣)!

こんにちは、管理人のみしぇるです。

以前、別の記事で「小見出しが目次に表示されなくて困った」ということを書きました。

その解決方法が分かったので、ご紹介します。

・目次の作り方が分からない人
・小見出しの作り方が分からない人
・目次の表示設定を知りたい人

では、早速見ていきましょう。

目次を作成する

目次は「見出し」機能を使えば、自動的に作成されます。

【やり方】

「見出し」をクリックします。

見出しが表示されます。↓

(テストと仮に入力します。)

テスト

そしてプレビューを確認してみると、こうなっています↓

とても簡単ですね♪

続きまして、小見出しを作っていきます

まずは見出しを表示させます。

すると下のような表示が出ます。

赤四角で囲んだ「H2」をクリックします。

これは見出しレベルを変更できるボタンで、「H3」を選択すると小見出しが作成できます。↓

テスト

プレビューで確認すると、こうなります。↓

とても簡単でしたね♪

見出しレベルは「H6」まで選択できるので、小見出しの小見出しや、小見出しの小見出しの小見出しを作りたい方は同じ方法で作ってみて下さい。

目次に表示させる「見出しレベル」を設定

目次に表示させる「見出しレベル」は自分で設定することができます。

つまり、目次に「どのレベルの小見出しまで表示させるか」を設定できます。

【参考図 小見出し「H6」まで表示させた場合↓】

【やり方】

編集画面に行き、「Cocoon設定」を開きます。

そして「目次」のインデックスを選択。

下に降りていくと、「目次表示の深さ」を選択できる項目があります。

そこで自分の好きなレベルを選択できます。

ちなみに私は細かい見出しまでは使わないので、「H3」で良いかなと思っています。

まとめ

お試しに「H6」まで表示させてみました。

上の画像を見ていただくと分かると思いますが、もし複数のレベルの小見出しをたくさん使っていて、かつそれを表示させたい場合は、目次が長くなります。

そうすると、早く本文に行きたい読者にはスクロールの手間をかけさせてしまうかもしれません。

一方、少しでも早く知りたいところに飛びたい読者には時間短縮になって親切ですね。

みなさんの記事の読者にとってどういう目次が便利なのか、ぜひいろいろ試してみて下さいね!

最後まで読んでいただき、ありがとうございました。

☆↓ポチっと応援よろしくお願いします↓☆

にほんブログ村 ブログブログ ブログ運営へ にほんブログ村 ブログブログへ

コメント

タイトルとURLをコピーしました