ワードプレス目次の作り方!Table of Contents Plusプラグインの使い方

ワードプレス 目次の作り方

ブログ記事を見たときに、
目次があるのとないのとでは、

どんな内容が書かれているのか
すぐに判断することって
難しいですよね。

ユーザーは、見やすい読みやすい
記事であればあるほど、
ブログの滞在時間が長くなります。

WordPressプラグイン
「Table of Contents Plus」は、
記事の見出しごとに目次を自動で
設置してくれます。

「Table of Contents Plus」の
使い方を説明します。

1.Table of Contents Plusのインストールと有効化

まず最初に、
WordPressプラグイン
「Table of Contents Plus」の
インストールと有効化をします。

管理画面にログインし、
画面左側にあるメニュー
「プラグイン」→「新規追加」を押します。

ワードプレス 目次の作り方

右上の枠に
「Table of Contents Plus」を
入力します。

ワードプレス 目次の作り方

「Table of Contents Plus」プラグインの
「今すぐインストール」を押します。

ワードプレス 目次の作り方

画面が切り替わるので、
「有効化」ボタンを押します。

ワードプレス 目次の作り方

画面がインストール済みの
プラグインの画面に
切り替わります。

ワードプレス 目次の作り方

インストール完了です。

2.Table of Contents Plusで目次を自動で作れる使い方

Table of Contents Plusの設定を
していきます。

目次が自動生成されるには、
見出しタグが必要となります。

見出しタグとは、
「h1」「h2」で囲まれた
タグのことです。

大見出し・小見出しまで
細かく見出しを設定できます。

記事のタイトルが
「h1」になっているので、
設定する見出しタグは、
「h2」から使うことになります。

大見出しを「h2」として、
小見出しを「h3」「h4」…
と設定しましょう。

記事を書くときには、
「見出し」をしっかりと
つけてください。

ビジュアルでの投稿の際には、
見出し部分を選択します。

ワードプレス 目次の作り方

見出しを選びます。

ワードプレス 目次の作り方

テキストでの投稿では
このようにタグで囲まれた
状態になっています。

ワードプレス 目次の作り方

2-1. TOC+設定画面

設定画面で
設定していきましょう。

画面左側にあるメニュー
「設定」→「TOC+」を押します。
※TOC+は、
Table of Contents Plusの略です。

ワードプレス 目次の作り方

2-2. 基本設定

Table of Contents Plusの
設定画面に移ります。

ワードプレス 目次の作り方

A:表示する場所
最初の見出しの前
これは、デフォルトのままでOKです。

B:表示条件
見出しがいくつ以上ある時に
目次を表示させるか、
という数字です。

C:以下のコンテンツタイプを自動挿入
postは投稿記事、
pageは固定ページのことです。

postには必ずチェックを
入れてください。

D:見出しテキスト
目次の上に見出しを表示

目次のタイトルです。
「目次」「Contents」
どちらでもOKです。

ユーザーによる目次の表示・非表示を
切り替えを許可

表示非表示の切り替えボタンです。
目次を非表示にしたい場合に
つけるボタンです。

ワードプレス 目次の作り方 ワードプレス 目次の作り方

E:階層表示
見出しの階層の設定です。
(見出しと小見出しが
わかるようにする場合)

F:番号降り
見出しごとに順番に番号を
振るかどうかの設定です。

EとFは、目次として
見やすくするため、
チェックを入れておきます。

G:スムーズ・スクロール効果を有効化
目次を押した場合に、
その目次内容の場所に
スクロールして飛ぶかどうかの
設定です。

チェックを入れると、
その場所に高速でスクロールして
移動します。

ユーザーにとって、
すぐに見たい記事内容に
飛ぶことができるので、
チェックを入れておきます。

2-3.外観の設定

見た目のデザインの設定です。

ワードプレス 目次の作り方

H:横幅
自動(デフォルト)

I:回り込み
なし(デフォルト)

こちらの設定は、
デフォルトのままでOKです。

J:文字サイズ 95%
目次は本文よりも
少し小さめの文字サイズの方が、
見た目に分かりやすくなるので、
こちらもデフォルトでOKです。

K:プレゼンテーション
好きなデザインを選べます。

L:上級者向け

ここは設定をしなくても
目次表示は問題なくされます。

全ての設定が終わったら、
「設定を更新」を押して完了です。

2-4. サイトマップの設定

ワードプレス 目次の作り方

サイトマップを生成する機能です。

サイトマップを表示したい記事に
ショートコード

を貼り付けます。

この機能を使用しない場合は、
設定する必要はありません。

3.目次の表示場所と非表示設定の方法

記事ごとに目次を
表示させる場所を変えたい場合、
以下の記述をすることで
その場所に目次を
表示させることができます。

[toc]

また、目次を表示させたくない場合は、
以下の記述をします。

[no_toc]

目次を表示させたい記事、
表示させたくない記事を
分けることができます。

目次を設定完了したら、
このような目次が自動で
生成されるようになります。

ワードプレス 目次の作り方

4.まとめ

常にユーザーにとって
わかりやすい記事を考えることで、
ユーザーの滞在時間を
アップすることにつながります。

その結果、SEO効果も高まりますね。

価値のある記事を提供することと、
いかに読みやすくするか、を
重要視してみてください。

時間とお金も手に入れシンプルに成功する方法

個人でビジネスを始める方、小さい会社でも大きな利益を出したい方、自由な人生を勝ち取りたい方向けに 合計5本のビデオをプレゼントしております。 さらに期間限定ビデオもプレゼントしておりますので、今すぐ下記のボタンをクリックして詳細をご覧ください。

コメントを残す

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

CAPTCHA


ABOUTこの記事をかいた人

ビジネスZEROでは、0からビジネスを作り会社や国に頼らなくても自身で稼ぎ続ける起業、副業、WEBマーケティングノウハウを徹底的に追求し、個人でも稼ぐことが出来るビジネスモデルの作り方やマネタイズの方法等、具体的なノウハウを1から10まで可能な限り、トコトン提供していきます。