【Table of Contents Plus】でブログ記事に目次を表示させよう

 

 

その記事の内容が一目でわかる【目次】、あると便利ですよね。

でも、いちいち作るのは面倒くさい。

 

今回は、記事を書いたら自動で目次を表示してくれるプラグイン【Table of Contents Plus】のインストール方法をお伝えします。

 

↓こういう目次が自動で表示されるようになるんですよ↓

【Table of Contents Plus】ってどんなプラグイン?設置した方がいいの?

Table of Contents Plus は、上のような目次を自動で生成して表示してくれる、ワードプレスの便利なプラグインです。

 

目次があると、記事を読む訪問者さんに対して優しいですよね。

ブログの記事は1000文字以上が望ましいということは、このブログでもお伝えしていますが
(参照:ブログを毎日更新するのには理由があるんです

訪問者さんが急ぎで何か調べたいものがある場合、長い記事を最初から最後までスクロールしていくのは面倒です。

そんな時に目次があると、自分が知りたいことがどのへんに書かれているかわかるので親切ですよね^ ^

しかも、この『Table of Contents Plus』は目次の中のタイトルをクリックすることで、その場所にジャンプすることが出来るので非常に便利です。

 

また、ブログで収益を上げたい人にとって重要なSEOにも、目次があるのは有利になるので設置しておいた方が良いですよ。

 

Table of Contents Plusをインストール

それではさっそくプラグイン『Table of Contents Plus』をインストールしましょう^ ^

 

ダッシュボードの左メニューから『プラグイン』→『新規追加』をクリックします。

 

 

 

 

 

右上の検索ボックスに『Table of Contents Plus』と入力すると該当プラグインが表示されます。

『Table of Contents Plus』の【今すぐインストール】をクリックしてください。

インストールが始まります。

 

 

 

 

 

 

 

 

 

インストールが完了したら、【有効化】をクリックすることを忘れずに。

 

 

これで『Table of Contents Plus』がプラグインに追加されました。

プラグイン一覧にも表示されていますね。

 

それでは、設定に進んでいきます。

 

『Table of Contents Plus』の設定

プラグイン一覧の『Table of Contents』の【設定】をクリックしてください。

 

設定画面が表示されました。

わけわからない項目が並んでいるかと思いますが、これから説明する通りに設定して頂ければちゃんと目次が出来上がりますのでご心配なく!

 

①位置
目次を表示させる位置を設定します。

最初の見出しの前(デフォルト)
最初の見出しの後

の4つありますが、【最初の見出しの前(デフォルト)】に設定されている方も多いですし、見やすく、目次の役割に適した位置だと思うので、最初の見出しの前(デフォルト)に設定しておきましょう。

 

②表示条件
見出しがいくつあったら目次を表示させるかを設定します。
この数字以下の見出し数では目次が表示されません。

これはお好みで設定してもらって構いません。
私は3つにしました。

 

③以下のコンテンツタイプを自動挿入
よくわからない項目ですが
「目次を表示させたいページの種類」を設定します。
(【投稿記事】や【固定ページ】など)

私は【post(投稿記事)】と【page(固定ページ)】に設定しました。
お好みで、投稿記事だけでもいいかと思います。

 

④見出しテキスト
目次の表示設定です。

2つチェックを入れておき、目次のタイトルを決めましょう。
初期設定では【contents】になっていますが、私は【目次】にしました。


また、目次は表示したり非表示にしたりすることができます。
初期設定では【show / hide】になっていますが、わかりやすいように日本語で【表示 / 非表示】にしてみました。

この【表示 / 非表示】をクリックすると目次が出たり閉じたりします。

<表示>

非表示をクリックすると…

 

<非表示>

目次一覧が閉じます。

【表示】をクリックすればまた目次が表示されるようになります^ ^

 

 

 

 

⑤階層表示
言葉で簡単にわかりやすく説明するのがちょっと難しいので、まずは百聞は一見にしかず。

この赤枠部分が【階層表示】です。

どういう見出しの時にこの階層表示がされるかというと、私のブログテンプレートでは
【h3タグ】が『3 WordPress講座』部分の見出し
【h4タグ】【h5タグ】が階層表示の【3.1 / 3.2 / 3.3】部分の見出し
として目次に表示されます。

チェックを入れておきましょう。

 

⑥番号振り
目次の項目に番号を振るかどうかを選びます。

お好みで選んでください。

 

⑦スムーズ・スクロール効果を有効化
目次の項目をクリックした時に、その見出しの場所までスクロールしていく機能です。

このジャンプ機能は目次を設置するメリットでもあるので、チェックしておきましょう^ ^

 

 

次は目次の”見た目”を設定していきますよ。

 

⑧横幅
目次ボックスの幅を設定します。

初期設定のままで大丈夫です。

 

⑨回り込み
目次のボックスを左寄せや右寄せに設定することができます

これもこだわりがなければ初期設定【なし(デフォルト)】のままにしておきましょう。

 

⑩文字サイズ
目次の文字の大きさを設定します。

これもデフォルトのままでOKです。

 

 

設定完了までもう少しですよ^ ^

それでは、次は目次ボックスのデザインを決めます。

⑪プレゼンテーション
目次ボックスのデザインを選びます。

お好きなものを選んで頂いてOKです^ ^

 

 

そして、次が最後の設定です。

【上級者向け】の隣の【(表示)】をクリックしてください。

 

設定項目がたくさん出てきますが…

【見出しレベル】のみ設定します。

 

 

拡大してみました。

 

⑫見出しレベル
目次の項目で表示する見出しタグを設定します。

【h1】や【h2】はブログタイトルや記事タイトルに使用される見出しタグなので、【h3】から【h6】を選びます。

 

これで設定は全て終了です。

更新ボタンをクリックしましょう。

 

更新ボタンをクリックすると、目次が自動的に記事に挿入されるようになります。

さっそく記事をプレビューしてみましょう^ ^

 

最初の見出しの直前に目次が表示されていますね。

 

 

目次があることで訪問者さんの見やすい記事になります。

そしてSEO対策にも効果があるので、訪問者さんに有益な記事・ブログにするためには【Table of Contents Plus】は設置しておくべきプラグインですね^ ^

 

 

PS.
  私、姫宮かのんは
  月150時間の残業から逃げるように会社を辞めて
  今はネットビジネスをしながら
  夢を叶えるために動物系の専門学校に通っています。

 クラスメイトのみんなが
  学校帰りに夜遅くまでバイトをしている間
  私は自宅でテレビを見ながらパソコンに向かっています^ ^

  夢を叶えるための資金と時間を手に入れるために
  副業でのネットビジネスの始め方、取り組み方、考え方を
  メルマガで詳しくお話ししていきます。

  ビジネスや具体的な作業について
  丁寧に解説したテキストやマニュアルもプレゼントしていますので
  「叶えたい夢があるけどお金も時間もない!」状態ならば
  ぜひ、下の画像をクリックしてメルマガ詳細をご確認ください☆

↓↓↓



コメント

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

プロフィール


姫宮かのんと申します。

激務から鬱病を発症した後、月残業150時間から何とか逃れたいとアフィリエイトを始めました。
今は大きな夢を叶えるために、専門学校に通いながらアフィリエイト活動を続けています。

このブログでは、知識も実績も自信もゼロから出発する初心者さんでも確実に稼げるようになるために、わかりやすさをモットーにあなた目線で知識と情報を配信していきます。

もう社会人だから…と諦めている夢はありませんか?
アフィリエイトで十分な資金と自由な時間を手に入れて、私のように夢を叶える一歩を踏み出しませんか?

詳しいプロフィールはこちら

ブログランキング参加中です^ ^
あなたの1クリックが
私の心の支えになってます♪

かのんが自信を持ってオススメ!!

アンリミテッドアフィリエイトNEO


稼ぐために必要な
ノウハウと手法を基礎から学べる
初心者必携の「教科書」です。
キチンと理解し正しく実践すれば
必ず稼げるようになります。

【Twitter】気軽にフォローしてくださいね☆

お世話になっている素材屋さん

Re:vre さま
Re:vre

あんずいろapricot×color さま