WordPressで書いた記事には「目次」をつけることができます。
目次をつけることで、ユーザーは目的の内容を閲覧しやすくなるため、ユーザビリティの向上を計ることができます。
ユーザビリティについて詳しくはこちら
WorsPress記事に目次を入れる方法
3つの方法を解説します。
1. 手動で目次を作成する方法
2. プラグインを使用して目次を作る方法
3. 「Swell」の標準機能を使用する※ANIVAで製作されたホームページはこちらがおすすめ
手動で目次を作成する方法
「HTML」について知識があれば、手動で目次を作成することができます。
カスタムHTMLブロックを挿入する
「＋」マーク → 「カスタムHTML」をクリックしてください。
「カスタムHTMLブロック」が出現します。
カスタムHTMLブロックにコードを入力する
「カスタムHTMLブロック」にこのようなコードを入力すると、基本的な目次を作成することができます。
こちらをコピー&ペーストして使用してください
<a href="#anker1">①ここに目次</a>
<a href="#anker2">②ここに目次</a>
<a href="#anker3">③ここに目次</a>
<a href="#anker4">まとめ</a>
<h2 id="anker1">①ここに見出し２</h2>
<h2 id="anker2">②ここに見出し２</h2>
<h2 id="anker3">③ここに見出し２</h2>
<h2 id="anker4">まとめ</h2>要素を書き換える
記事の内容に沿って、「ここに目次」「ここに見出し」の部分を書き直してください。
前半のHTMLコードは左の目次に、後半は右の見出しに出力されました。
以上が、手動による目次の作成方法です。
プラグインを使用して目次を作成する方法
プラグイン（拡張機能）を使用して目次を作成する方法を解説します。
プラグインをインストールして有効化する
WordPress管理画面 → 「プラグイン新規追加」 → 検索欄に「Table of Contents Plus」を入力
上図のプラグインが表示されたら「今すぐインストール」をクリックし「有効化」もクリックしましょう。
「TOC＋」をクリック
有効化が完了すると、ダッシュボード左側に「TOC＋」の項目が出現するので、クリックしてください。
目次タイトルを変更する
初期設定では目次のタイトルが「Contents」になっています。日本語に直したい方は「目次」に修正しておきましょう。
初期設定では、目次の「表示・非表示」を切り替えるテキストが「show・hide」になっているため、日本語に直したい方は「表示・非表示」に修正しておきましょう。
デザインを変更する
「プレゼンテーション」の項目でデザインを設定することができます。お好みのデザインを選択しましょう。
「設定を更新」をクリックして完了
変更を加えた場合は忘れずに「Save Changes」をクリックして変更内容を保存しておきましょう。
プラグインを使用して目次を作成する方法は以上です。
「Swell」の標準機能を使用する(※ANIVAで製作されたホームページはこちらがおすすめ)
WordPressに使用している「テーマ」によっては、標準機能として目次を作成する機能が備わっている場合があります。
ANIVAで製作するホームページは「Swell」というテーマを使用しており、標準機能で目次を作成可能です。
使用方法について解説いたします。
目次を「表示」に切り替える
作成した記事の右側下部にある「目次」の項目をクリックして「表示」に切り替える。
その結果、目次が自動的に作成されました。
「Swell」の標準機能を使用した目次の作成方法は以上です。
記事に目次をつける方法のまとめ
今回は、投稿記事に目次をつける方法について解説しました。
「カスタムHTML」を使用して目次を作成する場合はコードに対する知識が必要となりますが、その代わりに自由度が高く細かい設定が可能です。
ANIVAでホームページを制作された方や「Swell」のテーマを使用している方は、標準機能を使用することがおすすめです。
手間なく便利な目次を作成することできるからです。
目次を作成することで記事の見やすさが大きく変わるため、ぜひ目次をつけてみましょう。
