ブログアフィリエイターのひつじさん（@hituji_1234）が公開した目次プラグイン「Rich Table of Contents」をTAKUBLOGに入れてみたので、入れた際に行った微調整を解説したいとおもいます。
追記：AFFINGER5でも不具合なく使えるようになるまで、今まで使っていたAFFINGER純正の目次プラグインの「すごい目次」に戻すことにしました。
Rich Table of Contentsはどんな目次プラグインなの？
丁寧に解説しようと思ったんですが、詳しい解説は紹介ページを見ていただく方がわかりやすいのでそちらを見てください。
なのでここでは私が「Rich Table of Contents」で良いなと思ったところを解説します。
見出しのデザインの変更が簡単
ブログによっては見出しの前に「数字」にするか「・」にするか迷って、何度も自分でデザインをいじることがあったんですが、「Rich Table of Contents」なら管理画面で反映後のデザインをリアルタイムで確認しながら変更ができちゃいます。
スマホで「目次に戻る」ボタンが置ける
この機能が欲しいと思ったかた大勢いたと思います。私もその1人です。
他の目次プラグインでもできないことはないんですが、ちょっと面倒なので敬遠していました。
「Rich Table of Contents」なら管理画面で応用設定で目次に戻るボタンをONにするだけで実装できちゃいます。
スマホでも見やすい
記事内の目次ってパソコンで確認するとすごく見やすいんだけど、スマホで確認すると見にくいってことありません？
とくに画面サイズの小さいスマホで見ると、どこまでがh2の見出しでどこからがh3の見出しかわかりづらいことが多々あります。
「Rich Table of Contents」のデザインはその名の通りリッチ感のあるオシャレなデザインの目次が置けるので、スマホでも一目で目次だと認識できますし、h2とh3の区別もしやすいです。
「Rich Table of Contents」をインストールして必要な微調整
「Rich Table of Contents」の目次に戻る機能は、そのままだと表示される位置が高くて違和感があります。それを適切な位置に調整します。
「RTOC設定」→一番下の「応用設定」→「目次に戻るボタンの上下調整」→空欄に「20」を入力。
これで右側の「TOPへ戻る」ボタンと高さが一緒になります。
目次の戻るボタンを右側の「TOPへ戻る」ボタンの上に表示したい場合は、空欄に「80」を入力。
多少横の位置はずれてしまってますが、これ以上は現状できませんm(_ _)m
確認できている不具合
リリース直後なので多少の不具合を確認しています。
プラグインをインストールした後に新規記事を投稿すると、記事が改行されていない。
もしかしたらブログに入れている別のプラグインが原因かもしれませんが、今のところ「Rich Table of Contents」を有効にしているときだけ記事の改行が無視されてしまします。
対策としては面倒にはなりますが、新規で記事を書くときだけプラグインをOFFにするしかないです。
スマホ画面でトップページのみメニューが開けない
「Rich Table of Contents」を有効にしているときは、スマホのトップページのスマホメニューが反応しません。
記事ページに移ると反応します。
トップページのみ反応しないのでそこまで影響はないと思います。
追記：アップデートで現在は改善されています。