記事の目次を自動で作るプラグインTable of Contents Plusの使い方
Table of Contents Plusは、記事に自動で目次を作ってくれる便利なプラグインです。
目次があるとユーザーにとっても記事が見やすくなります。ブログの見た目もよくなり、
SEO(検索エンジン対策)にも効果があるので一石三鳥ですね。
Table of Contents Plusは、h1~h6の見出しを引用して目次を作成します。
ですから、記事を作るときは見出しを適切につけていく必要があります。
Table of Contents Plusのインストールと有効化
まずはTable of Contents Plusをインストール、有効化してください。
プラグインのインストール・有効化はこちらを参考にしてください。
Table of Contents Plusの簡単設定
WordPress管理画面>設定>TOC+をクリックします。
この記事の上にあるような目次であれば赤い字の箇所だけを設定だけすれば
記事ごとにいちいち設定しなくても自動で作成してくれます。
Main Option
Position
ページ内の目次の位置を設定します。ここは変更しません。
- Before first heading(default)
記事の最初の見出しのすぐ上です。 - After first heading
記事の最初の見出しのすぐ下です。 - Top
記事ページの一番上です。 - Bottom
記事ページの一番下です。
Show when
目次を作る場合の条件を設定します。
見出しが4つ以上あれば目次を表示するようになっています。
Auto insert for the following content types
目次を設置する投稿タイプ〔post(投稿)・page(固定ページ)〕を設定します。
「post(投稿)」のみにチェックします。
※Contact Form 7などのプラグインを導入していると選択肢として表示されます。
Heading text
□Show title on top of the table of contents
目次そのものにタイトルをつける場合はチェックしたままにします。
下の入力欄の「Contents」はタイトル名ですので、「目次」などに変更します。
□Allow the user to toggle the visibility of the table of contents
ユーザーが目次を表示したり非表示にしたりできるようにする場合はチェックします。
「show text」の「show」は「表示」、「Hide text」の「hide」は「非表示」に変更します。
表示される文字を日本語にするだけです。
□Hide the table of contents initially
チェックを入れると、記事ページを開いた時、目次が非表示になります。
「表示」をクリックしないと目次が表示されません。
こんな感じです↓
Show hierarchy
目次に階層をつけるかどうかです。
<階層あり>
<階層なし>
Number list items
目次に番号をつける場合はチェックしておきます。
Enable smooth scroll effect
目次をクリックしたときに該当箇所までジャンプするかスクロールするかです。
□Scroll rather than jump to the anchor link
スクロールさせたい場合はチェックします。
Apprearance
Width
目次を囲っている枠の幅を設定します。px(ピクセル)か%で設定できますが
「Auto(default)」(自動)のままでいいでしょう。
Wrapping
表示位置を右にするか左にするかです。デフォルト(初期設定)のままでも通常は左になります。
Font size
文字の大きさを設定します。
Presentation
目次のデザインを選べます。
Customをチェックすると自分で作成できます。
Advanced (show)
「show」をクリックすると、Advancedの設定画面が開きます。
ここは設定の必要な個所だけ説明します。
Heading levels
目次にどこまでの階層を表示させるかを設定します。
賢威を使用している場合、記事タイトルがh2で、記事中の見出しはh3~6になります。
2階層までならh3とh4に、3階層までならh3~h5にチェックがあればいいので、
他はチェックをはずします。
Exclude headings
指定した文字が含まれる見出しを目次から除外します。
このサイトの場合、ページの下の方に「関連記事」を表示しています。
「こちらの記事も参考になります」という箇所ですが、ここがh3になっていますので、
初期設定のままですと目次に含まれてしまいます。
そこで入力欄に「こちらの記事も参考になります」と入力しておけば
目次から除外されます。
目次の位置を微調整する
このサイトでは、ページ内での目次の位置は、記事の最初の見出しの
すぐ上に設定しています。
初期設定のままですと、見出しに近すぎるので少し離すように設定しなおしました。
その方法を紹介します。
<before>
<after>
WordPress管理画面>プラグイン>プラグイン編集をクリックします。
「編集するプラグインを選択する」から「Table of Contents Plus」を選び「選択」ボタンを押します。
画面右の「able-of-contents-plus/screen.css」をクリックします。
「margin-bottom:1em」の箇所の1emを好きな幅に変更します。
このサイトは3emに変更しています。
「ファイルを更新する」をクリックして設定完了です。
特定の記事だけ目次を表示しない
例えば見出しを使って〇〇ベスト10などのランキング記事を作った場合、
1位〇〇などのランクが目次になるとおかしいですよね。
他にもこれと似たケースが出てくるかもしれません。
こんな風に見出しをたくさん使ったけど、目次がない方がいいというときに、
その記事だけ目次を表示しない方法を紹介します。
やり方は簡単です。
投稿の編集」画面のテキストのどこでもいいのでを記述するだけです。
※[ ](カッコ)も必ずつけてください。
最近のコメント