WordPressブログにEasy Table of Contentsプラグインで目次機能を追加する

WordPressブログに目次を追加する

ブログをご覧くださいましてありがとうございます。

遅く寝たのに早く目が覚めました。

目が覚めたらやることは一つ。

ブログ書く。

コップ一杯の水を飲んでブログを書くことを始めます。

他は何もやりません。

まずブログ書くことから。

今日はWordPressブログの拡張機能であるプラグインについて。

このブログなんですが、Wordpressというブログシステムでできていて、いろんなプラグインと呼ばれる追加機能を実装することが出来ます。

そして、ブログに目次がなかったので、Easy Table of Contentsという目次を自動的に作ってくれるプラグインを導入していきます。

WordPressのテーマは「SANGO」というテーマを使用しています

WordPressにはデザインを決めているものがありまして、それがテーマと呼ばれているものです。

当Wordpressブログではいろんなテーマを使っていましたが、表示の美しさや、SEO対策などの機能の充実度などを踏まえて、サルワカさんが製作されている「SANGO」というテーマを使っています。

ちなみに「SANGO」というテーマ、Web屋の私が唸るくらいの出来。

HTMLやCSSを触って自作テーマのベースにするには完成されすぎてまったく向いていませんが、単体でブログなどに使うとかなりお勧めです。

ちなみにお値段は10,800円なのですが、これを10,800円で作れとかまったくもって不可能です。

うちでここまでテーマ作りこもうと思ったら数百万かかると思います。

素直に購入しましょう。

参考 SANGO心地よいWordpressテーマ

SANGOテーマに目次プラグインのEasy Table of Contentsを追加する

目次プラグインには種類がありまして、今までは結構「TOC+(Table of Contents Plus)」というプラグインが多く使われていました。

私も過去に何度かクライアントワークで使ったことがあり、結構実績のあるプラグインだったんで、導入しようと考えていましたが、テーマの作者のドキュメントには「更新されていないので、Easy Table of Contentsを使ってください」という旨のアナウンスがあったため、テストも兼ねて「Easy Table of Contents」を使っていきたいと思います。

WordPressのプラグインは古いものはセキュリティ的にボロボロなので、やはり頻繁に更新されているものを使っていった方がいいです。

プラグインに限らず、Wordpress本体や、テーマなども同様で、セキュリティの問題などが発生しやすくなっているので、必ず新しいものを使うようにしましょう。

Easy Table of Contentsプラグインのインストールと有効化

それではEasy Table of Contentsプラグインを使う準備をしていきます。

WordPressの場合、プラグインを使うには2段階あります。

インストールして、有効化するという2段階です。

それではEasy Table of Contentsをインストールしていきましょう。

また、インストールする方法も2種類あって、プラグインを自分のPCからアップロードする方法と、WordPressの管理画面から探してインストールする方法です。

今回は管理画面からインストールしていきます。

まずは管理画面を開きます。

WordPress管理画面

左側のサイドバーから、プラグインをクリックします。

WordPress管理画面 プラグインを追加

上部の新規追加をクリックします。

WordPress管理画面 プラグイン 新規追加

プラグインを探します。

右上の検索ボックスにプラグイン名を入力します。

今回は「Easy Table of Contents」と入力しますと、自動で検索されて表示されます。

WordPress管理画面 プラグイン追加 Easy Table of Contents

表示されました。

WordPress プラグイン追加 Easy Table of Contents

「Easy Table of Contents」を追加していきますので、今すぐインストールをクリックします。

WordPress プラグイン追加 Easy Table of Contents 今すぐインストール

今すぐインストール」をクリックすると、表示が「インストール中」、「インストール完了」と変化していき、ボタンの色も変わり「有効化」というボタンが出てきますので、こちらをクリックします。

WordPress プラグイン追加 Easy Table of Contents 有効化

画面が遷移して、「プラグインを有効化しました」と言う表示が出ます。

WordPress プラグイン追加 Easy Table of Contents プラグインを有効化しました

プラグインの有効化が完了しました。

有効化が完了するとプラグインの機能が使えるようになります。

ちなみに、プラグインを一時的に止めたい場合などは、無効をクリック。

プラグインを完全に削除したい場合は、無効にしてから、削除をクリックします。

Easy Table of Contentsプラグインの設定を行っていく

Easy Table of Contentsのインストールと有効化が終わったら、プラグインの設定を行っていきます。

こちらもSANGOカスタマイズガイドを参照して行っていきます。

参考 SANGOでEasy Table of Contentsの目次を表示するSANGOカスタマイズガイド

WordPress管理画面の設定をマウスオーバーすると設定項目が出てきますので、目次をクリックします。

WordPress プラグイン設定 目次 Easy Table of Contents

設定画面が出てきました。

こちらはSANGOのカスタマイズガイドに設定が記載されていますので、推奨設定をそのまま使います。

WordPress Easy Table of Contents SANGO 設定

高度な設定も変えていきます。

WordPress プラグイン 設定 Easy Table of Contents 高度な設定

位置や表示条件などはブログの書き方によって変わってきますので、変更を行ってください。

また、CSSのスタイル読み込みを禁止にすることが重要だそうですので、忘れないようにチェックを入れてください。

これで設定が完了します。

Easy Table of Contentsの表示確認

投稿ページに行って、表示を確認します。

Easy Table of Contents 投稿画面の表示

綺麗に表示されています。

これで目次の表示は完了です。

Easy Table of Contentsの目次をサイドバーに固定する

ちなみにSANGOテーマは、本当に優秀で、目次を表示するだけではなく、サイドバーに固定表示することも可能です。

至れり尽くせりです。

まずはウィジェットの設定を行います。

管理画面より、外観をマウスオーバーしてウィジェットをクリックします。

WordPress 管理画面 ウィジェット追加

ウィジェット設定画面が出てきますので、目次ウィジェットを追尾サイドバー(PCのみ)にドラッグアンドドロップして追加します。

WordPress ウィジェット 目次の追加

タイトルを「目次」にして、閲覧中セクションのハイライト色を設定して、保存をクリックします。

サイドバーウィジェット 目次追加

これで完了です。

投稿ページの確認をしてみましょう。

WordPress 目次 固定サイドバー

バッチリ表示されていると思います。

また、スクロールに合わせて、どこを参照しているかがわかりやすくなっています。

訪問者が使いやすいウェブサイトを目指す

ブログなどのコンテンツは、文章量が多くなると見づらくなってきたりすることがあります。

また、長くなればなるほど、読む人と離れていく人の差も激しくなります。。

目次で探してリンクするだけでも、訪問者が閲覧する場合には非常に使いやすくなりますし、コンテンツの中身を把握しやすくなります。

ブログをしっかり見てもらうためにも、目次などを設定することはかなり有効です。

今回はSANGOのテーマを使用しましたが、他のワードプレステーマなどでも目次を設定して見出しにジャンプさせることは非常に有効です。

WordPressをどんどんカスタマイズして、自分や訪問者にとって使いやすくしていくことがアクセスアップにも繋がります。

今後どんどんWordPressのことなどもブログに書いていこうと思っています。