WORDPRESS

【2021年】WordPressプラグイン「Easy Table of Contents」の基本的な設定方法を初心者向けに解説【ブログ記事の目次を自動生成】

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 アイキャッチ
 

あずきです🐥

WordPressにおけるおすすめなプラグインの1つ…

Easy Table of Contents

について、その導入手順と「基本的な設定方法」をブログ初心者さん向けに1から解説していきます

 

まず!

この「Easy Table of Contents」は、WordPressで投稿した記事ごとの「目次」を自動生成するためのプラグインです

もちろん無料のプラグインだよ!
 

具体的には、そのページ内に設置した「見出し」をもとに…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 top-01

↑ こういった目次ボックスが、記事ごとで自動挿入されます

 

そもそも、WordPressの「目次作成」と言えば…

Table of Contents Plus(通称TOC+)

というプラグインが有名ですが、ただ最近は「バージョンの更新」が長期間空いてしまっているケースも目立ち、徐々に…

Easy Table of Contents

が「新たな定番」になってきている印象です

使い勝手も似ていて簡単!
 

ということで、今回は2つのステップで丁寧に解説していきます

  1. 「Easy Table of Contents」の導入手順【インストールと有効化】
  2. 「Easy Table of Contents」の基本的な設定方法

さっそく見ていきましょー🐥

 

\ 本気で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

「稼ぐ」に特化したWordPress テーマ『WING AFFINGER5』

今なら超時短ツール「タグ管理プラグイン(税込4,980円)」を無料配布中!

「WING AFFINGER5」の気に入ってる点・気になる点をガチレビュー アイキャッチ
【愛用】「WING AFFINGER5」って実際どうなの?気に入ってる点・気になる点をガチレビュー【WordPressのおすすめテーマ/専業ブロガー4年目】

続きを見る

WordPressの「タグ管理」とは? アイキャッチ
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】

続きを見る

 

注意

プラグインを使用することで、ご利用中のWordPress環境などによっては不具合が生じてしまう可能性があります。 プラグインの使用に際しては、あらかじめデータやファイルをバックアップされたうえで、ご自身の責任にて行ってください

 

関連:WordPressプラグイン「BackWPup」の設定方法を初心者向けに解説【ブログに必須な自動バックアップ】

 

【2021年版】WordPressプラグイン「Easy Table of Contents」の導入手順と基本的な設定方法【ブログ記事の目次を自動作成】

ステップ①:プラグイン「Easy Table of Contents」をWordPressに導入する手順【インストール&有効化】

WordPressブログ「完全初心者」ガイド 見出し b-01

はじめに…

プラグイン「Easy Table of Contents」の導入手順

について

 

WordPress管理画面の左側にある一覧メニューから…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-1-01

↑「プラグイン」という項目にカーソルを合わせ、開いたメニュー内にある「新規追加」をクリックしましょう

 

つづいて、画面の右上にある…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-1-02

↑ こちらの検索フォームに Easy Table of Contents と入力し、その下の検索結果から…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-1-03-a

↑ このアイコンが目印のプラグイン「Easy Table of Contents」を探します

 

無事見つかったら…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-1-03-b

↑ こちらの「今すぐインストール」ボタンをクリックし、このボタンが…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-1-03-c

↑ このように「有効化」という表示に切り替わったことを確認したら、こちらの「有効化」ボタンもクリックして、プラグインの導入は完了です🐥

お次は肝心の「設定方法」を見ていこう!

\ 本気で成果にこだわるなら /

AFFINGERタグ管理マネージャー3 01

―― 効果のある広告やリンクを徹底解析 ――

「超強力」なサイト改善と効率化!「AFFINGERタグ管理マネージャー3 + PVモニター」プラグインセット

※「STINGERタグ管理プラグイン3」のデータはそのまま使用できます

「WING AFFINGER5」及び「WING STINGER PRO2」専用プラグイン

 

ステップ②:プラグイン「Easy Table of Contents」の基本的な設定方法

WordPressブログ「完全初心者」ガイド 見出し b-02

つづいて2つ目のステップは…

「Easy Table of Contents」の基本的な設定方法

について

 

WordPress管理画面の左側にある一覧メニューから…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-top

↑ 設定 > 目次 をクリックしましょう

 

「Easy Table of Contents」の設定画面が開いたら、ここから「3つ」の設定エリアにわけて設定を行っていきます

  • 一般
  • 外観
  • 高度
まずは【一般】エリアから!
 

【一般】エリアの設定

WordPressブログ「完全初心者」ガイド 見出し b-03

プラグイン「Easy Table of Contents」の設定画面を開いたら、まずは1番上側にある…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-top

↑ こちらの、左上に 一般 と表示されているエリアの設定から行っていきましょう

 

設定内容に唯一絶対の正解はありませんが、ここでは自分が実際に行っている設定をもとにご紹介していきますね🐣

項目の数がけっこうあるから、デフォルトの設定を変更してるとこだけ見ていくよ!
 
【一般】エリア:「サポートを有効化」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-01-a

↑「サポートを有効化」の項目では、今回行っている「全体」の設定とは別で…

投稿・固定ページなどの編集画面

の1番下側に、「Easy Table of Contents」専用の設定エリアを追加するかどうかを指定できます

 

具体的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-01-b

↑ このような設定エリアが、投稿や固定ページの各編集画面に「個別」で追加されます

「記事ごと」で目次の表示をカスタマイズするときに便利!
 

で、基本的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-01-c

↑ このように…

  • 投稿
  • 固定ページ

という2項目にチェックを入れておくのが無難です

 
【一般】エリア:「自動挿入」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-02-a

↑「自動挿入」の項目では、目次を自動作成する対象の「投稿タイプ」を指定できます

 

こちらも、さきほどと同様に…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-02-b

↑ この…

  • 投稿
  • 固定ページ

の2項目を入れておきます

目次を表示させたくない投稿や固定ページについては、「個別」の編集画面からカスタマイズすればOK!
 

補足

「有効化済みの投稿タイプにのみ自動挿入します」という注釈がありますが、実際に試してみたところ、「サポートを有効化」の項目で仮にチェックを外しても、こちらの「自動挿入」にチェックを入れていれば目次は無事表示されました

 
【一般】エリア:「表示条件」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-03-a

↑「表示条件」の項目では、「見出しが●件以上ある場合に、目次を自動で表示」といったルールを指定できます

 

こちらの件数は任意ですが、通常は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-03-b

↑「3件」くらいにしておくと無難だと思います

 
【一般】エリア:「見出しラベル」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-04-a

↑「見出しラベル」の項目では、実際に表示される目次のなかの…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-04-b

↑ こちらの「タイトル部分」の名前を指定できます

 

ここの名称もお好みですが、基本は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-04-c

↑「目次」などにしておくと、シンプルかつわかりやすくておすすめです

 
【一般】エリア:「初期状態」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-05-a

↑「初期状態」の項目では、記事にアクセスして表示される目次の状態を…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-05-b

↑ このように、最初は「閉じた状態」にするかどうかを指定できます

 

こちらも任意ですが、個人的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-05-c

↑ チェックを入れておくのがおすすめです

 

「そもそも目次の存在をすべてのユーザー(=訪問者)が求めているか?」と考えたときに、必ずしも「そうではない」という層もいると思うので…

  • 目次を見ないユーザーのために、基本は「クローズ」にして邪魔にならないように
  • そのうえで、目次が必要なユーザーには、その都度自分で「オープン」してもらう

という形が1番無難じゃないかなという判断です

扱うジャンルとかにもよるかも!
 
【一般】エリア:「カウンター」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-06-a

↑「カウンター」の項目では、目次に表示される見出しリストの頭に…

見出しの階層

がパッとわかるよう「数字」を自動で割り振るかどうか、またその「表示タイプ」を指定できます

 

具体的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-06-b

↑ こちらの部分ですね

 

関連

「そもそも見出しってなに…? 階層ってどういう意味?」という場合は、こちらをどうぞ ↓

WordPressブログの「見出し」とは?H1・H2・H3…の作り方&使い分けのポイント アイキャッチ
WordPressブログの「見出し」とは?H1・H2・H3…の作り方&使い分けのポイント【記事の階層を作る】

続きを見る

 

ただ個人的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-1-06-c

↑「なし」に設定しておくのがおすすめです

 

この「カウンター」は一見すると便利な機能ですが、仮に「そもそも自分で数字を入れてしまっている」というパターンもあるかもしれないので、その場合…

頭の数字が重複

してしまい、かえってわかりづらくなる可能性があるためですね

 

ということで…

【一般】エリアのそのほかの項目については、通常デフォルトのままで問題ありません🐥

つづいて、その下の【外観】エリアを見ていこう!
 

 

【外観】エリアの設定

WordPressブログ「完全初心者」ガイド 見出し b-04

同じく「Easy Table of Contents」の設定画面から、今度は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-top

↑ こちらの、左上に 外観 と表示されている設定エリアを行っていきます

またデフォルト設定から変更する項目だけ見ていくよ!
 
【外観】エリア:「幅」「カスタム幅」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-01-a

↑「幅」と「カスタム幅」の項目では…

  • まず「幅」の項目で、目次ボックスの「横幅サイズ」をいくつかの選択肢から選ぶ
  • 「幅」の選択肢では足りないという場合のみ、「カスタム幅」の項目から細かく指定

することができます

 

こちらも任意ですが、参考までに自分は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-01-b

↑ このように…

  • 幅 ユーザー定義
  • カスタム幅 95%

という設定にしています(デフォルトの「Auto」は個人的にしっくりきませんでした)

 

ちなみに「100%」だと、スマホ画面で確認したときに左右の ”ぐらつき” が気になったので、結果「95%」に落ち着きました

※使用しているWordPressテーマを始め、WordPressの環境などによっても変わる可能性がります

このブログのテーマは「AFFINGER」を使ってるよ!
 
【外観】エリア:「タイトル文字サイズ」「タイトル文字の太さ」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-02-a

↑「タイトル文字サイズ」と「タイトル文字の太さ」の項目では、目次のタイトルにあたる部分(例 目次 / コンテンツ )の…

  • フォントサイズ
  • 太さ

をそれぞれ指定できます

 

こちらも絶対の正解はありませんが、自分はいろいろ試してみた結果…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-02-b

↑ こちらの…

  • タイトル文字サイズ 100%
  • タイトル文字の太さ Bold

に落ち着きました

 
【外観】エリア:「テーマ」「カスタムテーマ」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-03-a

↑「テーマ」の項目では、表示される目次の「デザイン」をいくつかのテンプレートから選択できます

 

特にこだわりがなければ、デフォルトの「グレー」のままが無難だと思います

 

ちなみに!

用意されているテンプレートは使わずに、「自分で細かく決めたい!」という場合は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-03-b

↑ こちらの「カスタム」を選択したうえで、その下の…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-03-c

↑「カスタムテーマ」という項目から、任意のカラーを指定していく形です

 

参考までに、自分は「サイト全体」の配色と統一感をもたせるために…

  • 背景色 #ffffff
  • 枠線色 #ebebeb
  • タイトル色 #515151
  • リンク色 #0044cc
  • ホバー時のリンク色 #2a6496(デフォルトのまま)
  • 訪問済みリンク色 #428bca(デフォルトのまま)

↑ こちらのカラーでそれぞれ設定しています

 

実際の画面で見ると…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-2-03-d

↑ このようなイメージです

 

ということで…

ここまでできたら、【外観】エリアのそのほかの項目については、通常デフォルトのままでOKです🐥

最後に、【高度】エリアの設定を見ていこう!
 

 

【高度】エリアの設定

WordPressブログ「完全初心者」ガイド 見出し b-05

同じく「Easy Table of Contents」の設定画面から、今度は…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-3-top

↑ こちらの、左上に 高度 と表示されているエリアについて設定していきます

と言っても、デフォルトから変更するのは次の「1項目」だけ!
 
【高度】エリア:「見出し」
 
WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-3-01-a

↑「見出し」の項目では、目次に表示させる見出しの「階層」を指定できます

 

あまり深い階層まで表示させてしまうと、記事によっては ”冗長” な目次となって「かえって不便」になりかねないので、基本的には…

WordPressプラグイン「Easy Table of Contents」の基本的な設定方法 1-2-3-01-b

↑「見出し1」~「見出し3」までにチェックを入れておけば無難です

 

ちなみに!

「見出し1(=記事タイトルのこと)」を目次に載せるかどうかは任意ですが、自分は入れた方が「主題が伝わりやすい」かなと思っています

 

【高度】エリアのそのほかの項目については、通常デフォルトのままでOKです

 

ということで…

最後に「変更を保存」ボタンを忘れずにクリックしたら、「Easy Table of Contents」の基本的な設定は完了となります🐥

ここまでお疲れさま!
 

今回の記事はこちらの章に属しています

WordPressブログガイド 第4章「プラグイン」編 

あずきのWordPressブログガイド 総合TOP 

\ このブログでも愛用中! /

WING AFFINGER5 banner-large-01

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

 ✔ 洗練された美しいデザイン性と、「変幻自在」な圧巻のバリエーション!

 ✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現!

 ✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備!

今なら超時短ツール「タグ管理プラグイン(税込4,980円)」を無料配布中!

公式:「稼ぐ」に特化したWordPress テーマ『WING AFFINGER5』

関連:「WING AFFINGER5」気に入ってる点・気になる点をガチレビュー

WordPressの「タグ管理」とは? アイキャッチ
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】

続きを見る

 

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

 

独立4年目 / 元アパレル → 歴10年

 

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます。 普段はTwitter(@azuki_rinrin)にわりといるので、覗いてもらえると嬉しいです^^

-WORDPRESS

© 2019 あずきのぶろぐ