CONTENTS

INFORMATION

お知らせをもっと見る
ご相談可能スケジュール
こちらから最新の予約状況を
ご確認いただけます
埼玉県川口市でホームページ制作なら エンジニア歴13年の女性が対応いたします！
  1. ホーム
  2. Web Topics
  3. ホームページの作り方
  4. WordPressプラグイン
  5. 記事の目次を自動生成するWordPressプラグイン「Table of Contents Plus」

記事の目次を自動生成するWordPressプラグイン「Table of Contents Plus」

WordPressプラグイン
今田 紋奈
記事の目次を自動生成するWordPressプラグイン「Table of Contents Plus」

Table of Contents Plusというプラグインは、導入すれば記事の目次を自動生成できるWordPressプラグインです。
投稿や固定ページの記事に記述したH1からH6までの見出しを基に目次を自動生成してくれます。

記事の目次が自動生成されるということは、あなたのページにユーザーが来た際、記事の内容を一目で把握しやすくなる上に、探しているコンテンツに直ぐにたどり着けるという効果があります。
つまり、SEO上でもあなたのサイトがユーザーにとって良質なサイトであるというランク付けにも影響して来ます。
また、手動で目次を作成して更新したり、アンカーリンクを張る手間も省けるので是非導入しておきましょう！

初めて使用する際には見出し用のHTMLタグを階層的に記述する必要があるので、WPプラグインの仕様に慣れるまでに少し戸惑うかもしれませんが、慣れれば非常に便利なので活用しましょう。

H1からH6までの見出し設定をきちんとしていないと、記事の目次は生成されません。
また、見出し用の設定を階層的に記述していないと、目次がとても見にくくなってしまうので、慣れないうちは「下書き保存」と「プレビュー」を使ってマメに確認しながら使うといいです。

目次

おすすめポイント

  1. 記事の目次を自動生成できる。（H1からH6までの見出し用のHTMLタグを基に自動生成）
  2. 投稿、固定ページ、カスタム投稿タイプに対応。
  3. 目次の表示位置や表示内容を細かく設定できる。
  4. 人間用のサイトマップを自動生成する機能もある。

インストール方法

管理画面から検索してインストール。
もしくは、WordPress.org からダウンロードし、FTPツールを使ってアップロードして機能を有効化して下さい。

  1. WordPress管理画面 ＞ プラグイン ＞ 新規追加＞「Table of Contents Plus」で検索＞インストール＞有効化
  2. WordPress.org からtable-of-contents-plusをダウンロード

管理画面の設定

管理画面の場所

導入すれば記事の目次を自動生成できるWordPressプラグイン「Table of Contents Plus」の管理画面は下記の場所にあります。

  • プラグイン＞インストール済みプラグイン＞Table of Contents Plus＞設定
  • WordPress管理画面 ＞ 設定 ＞ TOC+

基本設定

目次を表示したい「場所・表示条件・投稿タイプ・デザイン」などを指定しましょう。
そして、実際に表示される目次の内容を確認しながら設定を調整しましょう。
画面下部にある「上級者向け」の設定項目は、初期状態では非表示になっていますがクリックすれば設定項目が表示されます。

もくじ関連のショートコード

もくじの表示／非表示

[toc]

もっとも基本となるショートコード。
プラグインの設定で表示条件を指定しているはずなので、それに合致する場合はこのショートコードを記述していなくても自動的にもくじは表示されます。
もくじを非表示にしたい場合、以下のショートコードを任意の場所に記述します。

[no_toc]

これらのショートコードは投稿（ポスト）、固定ページ、カスタム投稿タイプで有効です。

もくじのタイトルを変更する

[toc label="もくじのタイトル"]

設定したデフォルトとは違うタイトルをつけるには、labelプロパティを使用します。

もくじのタイトルを非表示

[toc no_label=true]

もくじに含める見出しを制御する

[toc heading_levels="2,3"]

ブログ記事で使われる中見出しは主に<h2>以降です。
<h3>のみにしたい、<h3>と<h4>だけにしたいなど、もくじとして表示したい見出しレベルを個別に指定できます。もくじに含めたい見出しレベル（<h2>なら2）をheading_levelsに記述するだけ。複数指定するときは例のようにコンマで区切ります。

もくじを回り込ませる

[toc float="left"]

floatプロパティを付与することができます。leftもしくはrightのみ指定可能。

もくじにクラスをつける

[toc class="クラス名"]

任意のクラスをつけることができます。このクラスは1つでなくてもよく、半角スペースで区切ることで複数のクラスをつけられます。

サイトマップ関連のショートコード

サイトマップを表示する

[sitemap]

すべての固定ページとカテゴリのリストを自動生成します。投稿やページだけでなくテキストウィジェットでも使用できますが、これには投稿（ポスト）は含まれません。

固定ページのみのサイトマップを表示する

[sitemap_pages]

投稿（ポスト）、カテゴリページなどは含まれません。

<h1>～<h6>までの使用する見出しを指定

[sitemap_pages heading="数字"]
  • リストのタイトルを変更
[sitemap_pages label="リストのタイトル"]
  • リストのタイトルを非表示（false もしくは true）
[sitemap_pages no_label="false"]
  • リストからページまたはカテゴリを除外
[sitemap_pages exclude="除外するページまたはカテゴリのID"]
  • リストからページまたはカテゴリを除外（子孫を含む）
[sitemap_pages exclude_tree="除外するページまたはカテゴリのID"]

カテゴリのみのサイトマップを表示する

[sitemap_categories]

sitemap_pages と挙動は同じで、カテゴリのみのリストを生成します。

投稿を含むサイトマップを表示する

[sitemap_posts]

sitemap は固定ページとカテゴリのみのリストでしたが、これは公開されたすべての投稿（ポスト）のリストを生成します。デフォルトではアルファベット順に並べられています。

  • 並び順を変更（ASCで昇順、DESCで降順）
[sitemap_posts order="ASC"]
  • タイトル順
[sitemap_posts orderby="title"]
  • 投稿日時順
[sitemap_posts orderby="date"]
  • ID順
[sitemap_posts orderby="ID"]
  • ランダム
[sitemap_posts orderby="rand"]
[sitemap_posts separate="true"]

まとめ

使っているテーマに目次機能が無く困っている人の救世主ですね！

Table of Contents Plusを利用すると、WordPressの記事の目次を簡単に自動生成でき、「リンクミス」や「見出しを変更した際に目次を更新し忘れる」等の人為的なミスが無くなり、結果的に記事を書く作業時間も捗ります。

サイトマップはともかく、もくじのショートコードは結構日常的に使うと思います。細かく見出しを分けて<h3>は除いていいかな～なんてときですね。これいらない気がする思うことも多いです。

[toc heading_levels="2,3"]あたりはクイックタグに登録しておくのもいいかと思います。
せっかく導入しているプラグインなので、ぜひご活用ください。

このプラグインを利用するには、H1からH6までの見出し用のHTMLタグを階層的に記述しておく必要があります。

WordPressプラグイン
  • URLをコピーしました！

この記事を書いた人

今田 紋奈のアバター 今田 紋奈

埼玉県川口市で、自営業や起業家のホームページ制作を行っいます。
Web制作会社に7年務めたのち独立。Web制作歴12年、2500件以上のサイト制作に携わり、WordPressサイトを得意とし「作って終わり」にしない、結果が出るサイトであることを大切にしてます。「10人いれば10通りの最適なサイトがある」という信念のもと、型にハマったサイトづくりではなく、マーケティングから考えた、その人のビジネスにとって一番最適なサイトをご提案。技術面で不安のあるWebデザイナーのシステム面のサポートも行っております。

この著者の記事一覧へ

関連記事

目次