無料テーマで多くの機能を利用できる「Cocoon」
「目次」は「Cocoon設定」からすぐ作ることができます。
完成例
記事タイトルのすぐ下にある「目次」です。下図の「投稿記事」は記事タイトルです。
Step.1 「Cocoon 設定」をクリック
青枠の「Cocoon設定」にカーソルを合わせてクリックします。
Step.2 「目次」をクリック
すると、設定画面が表示されますので、「目次」をクリックします（青枠）。
Step.３ 「目次を表示する」をチェック
「目次」をクリックして表示された画面を下にスクロール。
「目次の表示」の「目次を表示する」にチェックします（青枠）。
Step.４ 「変更をまとめて保存」して完了
さらに画面を下にスクロールし、「変更をまとめて保存」をクリックして完了です。
「変更をまとめて保存」しないと反映しないので、クリックし忘れに注意しましょう。
これだけで基本作業は完了です。
「一部のページだけ」目次の表示・非表示を変えたい時
一部のページだけ、全体の表示・非表示設定と異なる設定をしたい場合は、各ページ編集画面「ページ設定」の中の「目次を表示しない」にチェックするかしないかで切り替えることができます。
Cocoon設定で「さらにカスタマイズ」
さらに、Cocoon設定の基本機能で目次のカスタマイズも簡単にできます。
Step.３の「目次の表示」からさらに画面を下にスクロールして、様々な機能を設定します。
「表示ページ」で目次を表示するページを決める
「表示ページ」の項目で、目次を表示するページを選択することができます。
- 投稿
- 固定
- カテゴリー
- タグ
があります。とりあえず全てにチェックしておいて、不要だと思うものはチェックを外していけばいいでしょう。
「目次タイトル」で目次のタイトルを決める
「目次タイトル」で、タイトルを設定できます。
一般的な「目次」というタイトルから自分の好きなタイトルまで好きに変えられます。
目次タイトルは下図のように表示されます。
「目次切り替え」で目次の表示方法を決める
「目次切り替え」で、目次を開閉式にするかを設定できます。
「目次の表示切り替え機能を有効にする」にチェックをするかしないかで以下のような違いがでます。
「目次の表示切り替え機能を有効にする」にチェック（開閉できる）
「目次の表示切り替え機能を有効にする」にチェックしない（開閉できない）
「目次の表示切り替え機能を有効にする」にチェックする場合の「開」と「閉」の違いは以下のとおりです。「閉」の状態はとてもスッキリしてみえます。
「目次の表示切り替え機能を有効にする」にチェック（開いている場合）
「目次の表示切り替え機能を有効にする」にチェック（閉じている場合）
目次開閉表現の変更
先の青枠にある「閉じる」「開く」の表現は変えることができます（例）＋、ーなど）。
ページ訪問時の目次開閉状態の設定
また、「目次の表示切り替え機能を有効にする」にチェックした場合、ページを訪れた時の目次の開閉状態を選べます（下図「青枠」）。
「最初から目次内容を表示する」にチェックの場合は、開いた状態が基本になります。この辺りも好みで決めるといいでしょう。
「目次表示の深さ」で表示する見出しレベルを決める
「目次表示の深さ」では表示する見出しレベルを設定します。デフォルトはH6（最深）です。
デフォルト（H6見出しまで）だとこんな感じ。
「目次ナンバーの表示」で目次に数字やドットをつけるか決める
「目次ナンバーの表示」では、目次に数字やドットをつけることができます。
デフォルトは数字です。
見出しが多い場合、デフォルト（数字）だとやや煩わしくなります（下図）。
「目次の中央表示」で目次の位置を決める
「目次の中央表示」では、目次を左寄せ、中央揃えのいずれかを選べます。
以上、Cocoon設定での目次（カスタマイズ）でした。
細かいカスタマイズは、記事を投稿する中で自分のイメージに合ったものに微調整していくといいでしょう。
最後までお読みいただきありがとうございました。