Rich Table of Contentsは目次のデザイン性高く使いやすいプラグイン
Rich Table of Contentsとは
WordPressプラグインの「Rich Table of Contents」(略称:RTOC)は、誰でも簡単に記事に目次を自動生成できる、日本製の無料プラグインです。
記事内の見出し(h2, h3, h4など)を自動で検出し、それらをもとに目次を作成してくれます。
Rich Table of Contentsの主な特徴
- 簡単な操作性: 直感的なUI設計で、初心者でも迷うことなく目次を作成・設定できます。リアルタイムプレビュー機能があるので、設定変更がすぐに反映されるのを確認できます。
- 豊富なデザインオプション:
- 目次のタイトル、フォント、色、背景色、枠線のデザインなどを自由にカスタマイズできます。
- あらかじめ複数のプリセットデザインが用意されており、サイトの雰囲気に合わせて選択できます。
- H2、H3リストのデザインなども個別に設定可能です。
- 自動挿入とショートコード:
- 投稿や固定ページなど、指定したコンテンツタイプに自動で目次を挿入できます。
- ショートコードを利用すれば、記事内の好きな場所に目次を配置することも可能です。
- 表示条件の設定:
- 目次を表示する見出しの数(例: 見出しが3つ以上の場合に表示)を設定できます。
- 特定の投稿やページでは目次を表示しないように除外設定も可能です。
- 「目次に戻る」ボタン:
- スマートフォン表示時に、記事の途中で目次にスムーズに戻れるボタンを表示させることができます。位置や上下の調整も可能です。
- スムーズスクロール:
- 目次内のリンクをクリック(タップ)した際に、該当の見出しまでスムーズにスクロールする機能を設定できます。
- 目次使用率の計測:
- 7日間の目次利用率を計測する機能があり、記事編集画面で確認できます。
RTOCがおすすめされる理由
- 日本製プラグイン: 開発元が日本であるため、設定画面が完全に日本語で、サポートも受けやすいです。
- デザイン性と使いやすさの追求: 従来の目次プラグインの機能に加え、デザインの自由度と操作性が重視されています。
- テーマとの相性: WordPressテーマ「JIN:R」や「JIN」との相性が特に良いとされていますが、他の多くのテーマでも問題なく利用できます。
このように、Rich Table of Contentsは、ブログやサイトの読者のユーザビリティ向上や、記事のSEO対策に役立つ非常に便利な目次生成プラグインです。
※最新の情報を公式ページで確認ください
Rich Table of Contentsの使い方
Rich Table of Contentsは、WordPressの投稿や固定ページに目次を自動生成してくれるプラグインです。以下に基本的な使い方を説明します。
1. インストールと有効化
- WordPressの管理画面にログインします。
- 左メニューの「プラグイン」→「新規追加」をクリックします。
- 検索ボックスに「Rich Table of Contents」と入力し、検索します。
- 「Rich Table of Contents」が表示されたら、「今すぐインストール」をクリックします。
- インストールが完了したら、「有効化」をクリックします。
2. 基本設定
有効化すると、左メニューに「Rich TOC」という項目が追加されます。ここから設定を行います。
- 一般設定 (General Settings):
- 目次を表示する場所: 目次を表示する場所(記事の上、記事の下、または手動でショートコードを挿入)を選択できます。
- 見出しレベル: 目次に含める見出しレベル(h1, h2, h3など)を選択します。通常はh2からh4あたりを使用することが多いです。
- 最小見出し数: 目次が表示されるための最低限の見出し数を設定します。
- 目次タイトル: 目次のタイトルを設定します(例: 「目次」など)。
- スムーズスクロール: 目次をクリックした際に、滑らかにスクロールするかどうかを設定します。
- デフォルトで開く/閉じる: 目次を初期状態で開いておくか、閉じておくかを設定します。
- デザイン設定 (Design Settings):
- テーマ: 目次のデザインテーマを選択できます。いくつかのプリセットされたデザインがあります。
- 背景色、文字色、ボーダー色など: 目次の色やボーダーなどをカスタマイズできます。
- 高度な設定 (Advanced Settings):
- 除外する見出し: 特定の見出しを目次から除外したい場合に、その見出しのCSSセレクタなどを指定できます。
- CSSの追加: 独自のCSSを追加して、さらに細かくデザインを調整できます。
3. 投稿・固定ページでの使い方
Rich Table of Contentsは、基本的に設定が完了していれば、投稿や固定ページに自動的に目次を生成してくれます。
- 自動生成の場合:
- 記事内に設定した見出し(h1, h2, h3など)があれば、自動的にそれらを認識し、目次が生成されます。
- 特別な操作は不要です。
- 手動でショートコードを挿入する場合:
- もし、特定の場所に目次を挿入したい場合は、ブロックエディタ(Gutenberg)の場合は「ショートコード」ブロックを追加し、
[rtoc_mokuji title="目次"]
などのショートコードを挿入します。 - クラシックエディタの場合は、直接ショートコードを記述します。
- ショートコードのオプションで、タイトルを変更したり、表示する見出しレベルを指定したりできます。
[rtoc_mokuji]
:デフォルトの目次[rtoc_mokuji title="CONTENTS"]
:タイトルを「CONTENTS」にする[rtoc_mokuji headings="2,3"]
:h2とh3の見出しのみを目次にする
- もし、特定の場所に目次を挿入したい場合は、ブロックエディタ(Gutenberg)の場合は「ショートコード」ブロックを追加し、
4. 動作確認と調整
設定後、実際に投稿や固定ページを確認し、目次が意図した通りに表示されているか確認しましょう。もし表示がおかしい場合や、デザインを調整したい場合は、再度プラグインの設定画面に戻って変更してみてください。
ポイント:
- 見出しの構造: 目次が正しく機能するためには、記事内で適切な見出しタグ(h1, h2, h3など)を使用し、階層構造を意識して記述することが重要です。
- デフォルト設定の活用: まずはデフォルトの設定で試してみて、必要に応じてカスタマイズしていくのがおすすめです。
- キャッシュプラグインとの併用: キャッシュプラグインを使用している場合は、設定変更後にキャッシュをクリアしないと、変更が反映されない場合があります。
Rich Table of Contentsは比較的シンプルで使いやすいプラグインなので、ぜひ試してみてください。
【PR】
圧倒的に美しくおしゃれな WP テーマ 【ザ・トール】
は、多機能でありながらも高速表示に特化したWordPressテーマです。SEO対策、高速化、デザインの柔軟性など、サイト運営に必要な多くの機能がテーマ自体に組み込まれています。そのため、他の多くのテーマと比較して、テーマの基本機能を利用するために別途多数のプラグインを導入する必要はありません。
※「THE THOR(ザ・トール)」は、標準で目次機能を搭載しており、プラグインなしで目次を表示させることができます。
Rich Table of Contentsの注意点
WordPressプラグイン「Rich Table of Contents」は、手軽に目次を生成できる便利なプラグインですが、いくつか注意点があります。
主な注意点
- H5以降の見出しが目次に表示されない: Rich Table of Contentsは、デフォルトでH4までの見出ししか目次に表示されません。もしH5以降の見出しも目次に含めたい場合は、他のプラグインを検討するか、CSSなどで調整する必要があります。
- デザインのカスタマイズ性が限定的: スタイルオプションがやや制限されており、他のプレミアムプラグインと比較すると、より高度なデザインカスタマイズには向いていない場合があります。細かくデザインを調整したい場合は、CSSを自分で記述する必要があるかもしれません。
- ショートコード挿入時の挙動: ショートコードを使って目次を挿入した場合、その位置にのみ目次が表示され、自動挿入は行われません。自動挿入とショートコード挿入はどちらか一方しか利用できません。
- 目次の表示条件:
- 目次が表示されない場合、設定されている見出しの数(例えば4つ以上など)が満たされているか確認が必要です。
- プレビュー画面では目次が表示されず、実際の投稿画面でのみ表示される点も注意が必要です。
- パーマリンクが日本語になっている場合など、特定の条件下で目次が表示されないエラーが発生する可能性があります。
- スマホでの表示: 目次タイトルを中央寄せに設定した場合、スマートフォンでは開閉ボタンがタイトルの下に表示され、目次を閉じた状態でも面積が広がり、見た目のバランスが悪くなることがあります。
- 自動挿入と手動挿入の併用について: 基本的に自動挿入か手動挿入(ショートコード)のどちらかを選択して利用することになります。両方を同時に使用することはできません。
- テーマや他のプラグインとの競合: まれに、使用しているWordPressテーマや他のプラグインと競合し、目次が表示されないなどの問題が発生する可能性があります。
- 開発・サポート体制: 一部のユーザーからは、開発者のサポートが遅い、または改善の約束が守られていないといった不満の声も聞かれます。
運用上のアドバイス
- 見出し構造の最適化: H4までしか表示されない点を考慮し、記事の見出し構造をH4までに収めることを意識すると、目次がすっきりとまとまります。
- シンプルなデザインの活用: 細かいデザイン調整にこだわりがなければ、デフォルトのデザインをそのまま活用するか、必要最低限のCSSで調整するにとどめるのが良いでしょう。
- 表示条件の確認: 目次が表示されない場合は、まずプラグインの設定で「表示条件」が適切に設定されているか、見出しの数が条件を満たしているかを確認してください。
- WAF設定の確認: JSONエラーなどでウィジェットが保存できない場合、レンタルサーバーのWAF設定が影響している可能性があるので、一時的にWAF設定をオフにしてみるのも一つの手です。
これらの注意点を理解した上でRich Table of Contentsを使用することで、より効果的に目次を活用できるでしょう。