もくじ
[st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”#f3f3f3″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
この記事はTable of contents plus【TOC+】を使って、このような事態になった人向けになります。
- ネットで見た通りに試しても表示がズレたり、文字が変になったりする人
- ネットで直す方法を試しても直らなかった人
[/st-mybox]

どうも、おぎつです!
僕のこの記事の目次を見ていただけると分かると思いますが、キレイな目次ですよね!?
(綺麗な目次が当たり前ですが・・・)
僕は長い間、Table of contents plus【TOC+】のプラグインを使ってもこんな悩みがありました。
- [st-mybox title=”” fontawesome=”” color=”#757575″ bordercolor=”#f3f3f3″ bgcolor=”#f3f3f3″ borderwidth=”0″ borderradius=”5″ titleweight=”bold” fontsize=””]
- 目次の見出しと数字がかぶって表示されてします
- カスタムCSSをネットでコピペしても反映されない
[/st-mybox]
目次が汚いってことは、お店の入り口が汚いのと同じで読む前に読者が帰ってしまう大問題ですよね。
そして、ネットでいくら見て試しても上手くいかないので諦めて放置していました。
そんな中で急に偶然、解決策が見つかりました。
結論から言うと、Table of contents plus【TOC+】は古いことが原因でした。
画像を見ると分かると思いますが、3年前という古いプラグインなんですよね。
『ワードプレス 目次』と調べると、Table of contents plusばかりおすすめで出てくるから疑っていませんでした。
今の2019年のワードプレスのバージョンとTable of contents plusは合うかどうか検証されていないと記載もされています。
『じゃあ、結局なんのプラグイン使えばいいの?』って疑問が生まれてきますね。
簡単に解決できる!Table of contents plusで目次がズレたり、デザインが表示されない人へ

Table of contents plusは古いため、代わりのプラグインにはEasy Table of Contentsを使えば解決します。
名前似てるやんけ!!って僕は思いましたが、こいつの方が簡単でバグが出ないで目次ができます。
テンプレだと普通の目次になりますが、僕が使っている目次はこの記事で紹介しているものを使用しました。
https://kagesai.net/mokuji-css-customize/
この記事にコピペ用CSSがあるので、ワードプレスの左メニューにある『外観』→『カスタムCSS』に張り付けるだけでOKです。
※PC版のプレビューだと正常に目次が見えるけど、スマホだと少し表示がズレることがありましたが簡単に直せたので後で詳しくコードの編集部分を書きたいと思います。
他のサイトにもカスタムCSSがあったので違うものでもいいですが、紹介した記事は関連記事に最初の基本的な設定とカスタムCSS時の設定を分かりやすく画像で解説していたのでオススメです。
【結論】Table of contentsは絶対にオススメしない!口コミやサイトは古い物ばかりだ

WordPressになれていない初心者の人は、サイトを見てやるしかないですよね。
しかもTable of contents plusを紹介しているサイトは分かりやすいので、簡単に試してみて失敗して時間がかかってしまいますね。
プラグインが古いということで、他のプラグインも見ておくことをおすすめします。
今回の教訓は、『ワードプレスで使うプラグインに不具合が出たら違うプラグインも使ってみようとする』です。
いつもは不具合がでると、そのプラグインの不具合についてばかりググってしまったので視野が狭くなってしまっていましたね。
WordPress初心者で悩んでいる人がいたら、この記事が見つかってくれることを願います。
p.sツイッターでも拡散して困って、ツイッターで検索して出るようにツイートも拡散していただけると幸いです。