スポンサーリンク

スポンサーリンク

便利なプラグイン WordPress

【WordPress】自動で目次を生成してくれるプラグイン Table of Contents Plus

2018年7月8日

記事を書いていると『目次』を設置したいと思うことありませんか!?
でも記事ごとに毎回自分でソースを書いて目次を作るのは非常に手間です。

今回は『目次を自動で生成してくれるプラグイン』をご紹介します。

 

 

目次を自動生成してくれるプラグイン Table of Contents

Table of Contents Plus
https://ja.wordpress.org/plugins/table-of-contents-plus/

インストール

管理画面から[プラグイン]⇒[新規追加]⇒『Table of Contents Plus』を検索してください。

[今すぐインストール]して有効化してください。

 

基本的な設定

設定は管理画面から[設定]⇒[TOC+]をクリックしてください。
Table of Contents Plusの設定

位置

目次の表示位置

表示条件

見出しの数が何個以上あれば目次を表示させるかの設定

以下のコンテンツタイプを自動挿入

目次を表示させるページにチェックを入れて設定

見出しテキスト

目次の上部に表示される見出し部分の設定

階層の表示

階層の表示の設定

番号振り

目次に番号を表示させるかの設定

 

基本設定(外観)

横幅

目次の横幅の設定

回り込み

回り込みの設定

文字サイズ

目次の文字サイズの設定

プレゼンテーション

目次のデザインの設定
カスタムを選択すると背景色、ボーダーの色、リンク色の設定ができます。

 

スポンサーリンク

 
 

使い方

自動挿入

目次は『hタグ』を認識して自動生成されます。
見出しに『hタグ』を使わずに書いてある場合は目次は生成されません。

またWordPressのテーマのほとんどが記事タイトルに『h1』が使われているので、見出しには『h2~h6』を使用した方がいいです。

『hタグ』を見出しに使用している場合は、設定した位置に目次が自動で生成・挿入されていると思うので確認してみてください。

また目次に入れたくない『hタグ』の設定もできます。
[設定]⇒[TOC+]をクリックし、表示された設定画面のしたの方に『上級者向け』という項目がありますので横の[表示]をクリックしてください。

その中の『見出しレベル』で目次に入れたくない『hタグ』のチェックを外してください。
私の場合は、『h1』は使っていないのでそのままにしてありますが、『h2』と『h3』のふたつを目次に入れるように設定しています。(h4、h5、h6のタグを使用しても目次に含まれなくなります。)

 

手動で挿入する

位置がデフォルトの場合は最初の見出しのすぐ上に表示されます。
でも自分の好きな位置に目次を表示させたい時もありますよね。好きな位置に目次を表示したい場合は、ショートコードを使うと好きな位置に目次を表示させることができます。

また記事によって目次を表示したくない場合もあると思います。
表示したくない場合は、『基本設定』の『以下のコンテンツタイプを自動挿入』設定のチェックを外して、目次を表示したい記事・ページにショートコードを挿入してください。

 

2018年8月28日 追記

見出しのレベルを指定

上記の設定で表示させたい見出しのレベル(h2、h3…)の設定をおこないなした。
目次のショートコード[toc]に『heading_levelsを追加して見出しレベルを指定することができます。

例えば、私の場合は目次に表示させる見出しはh2とh3を表示させる設定にしています。
でも時々「このページだけはh4まで表示させたい!」ということもあります。
そんな時は[toc heading_levels=2,3,4"]と設定すると、h2、h3、h4まで表示させることができます。

 

ショートコードを簡単に設置するには?

プラグイン『Add Quicktag』を使っている場合、ショートコードを登録しておくとワンタッチでショートコードの挿入ができます。

 
 

目次のカスタマイズ

CSSを使用して目次のデザインのカスタマイズもできます。
カスタマイズ方法については、解説しているところがたくさんありますのでそちらを参考にしてください。

私が目次のカスタマイズで参考にさせてもらった記事

 
 

最後に

記事が長文になるとユーザーが知りたい情報にたどり着けず、読むのを諦めて記事から離脱してしまうこともあります。
目次を設置するとどんな内容が書かれているかわかりやすくなりますし、ユーザーが知りたい情報にすぐにたどり着くことができます。

多くの人に読んでもらうためにも目次の設置をしておいた方がいいと思います。

 

スポンサーリンク

 

応援よろしくお願いします。
      ブログランキング・にほんブログ村へ
Blog People ⇒ Blog People

お問い合わせはこちら Contact

 

 

おすすめ

おすすめ

-便利なプラグイン, WordPress
-,

Scroll Up

Copyright© きらり☆彡 , 2018 All Rights Reserved Powered by STINGER.