webデザイン・コーディングに役立つ情報、WordPressカスタムに使えるHTML・CSSコピペ用コード、Canva無料テンプレートなどをご紹介します♩

chiweblogちいウェブログ

【WordPress】目次を自動表示するプラグイン、Table of Contents Plusを使ってみたら神でした

【WordPress】目次を自動表示するプラグイン、Table of Contents Plusを使ってみたら神でした

最初に一言。

私はWordPressでは自作テーマを愛用しており、プラグインは最低限しか使いたくないと思っている為プラグインには詳しくありません。ご了承くださいませ。。

この記事を書いている人
Marie

Marie

  • フリーランスwebデザイナー&講師
  • 制作会社・インハウスデザイナーを経験し独立
  • オンラインwebデザイン教室ちいウェブ運営
  • 仕事の合間の息抜きに植物を育てています♡
  • スプラ・DIY・将棋がすき
  • 小4・年長の母

いや、割と最近まで、目次を自力で作っていました!

高度な設定のところで「HTML アンカー」に自分でid名を設定して、記事内の各見出しをコピーしては目次エリアに貼り付けて、自分で設定したidにリンクさせる、という

結構面倒くさい処理です。

このブログのテーマは自作なので、テーマに目次機能はついておりません。

そう、これまで当ブログの目次は、手間ひまかけてぐつぐつ煮込んだホワイトシチューだったという訳です。

ルーなんて使わないわよ

第1章:希望と絶望

いや、でもね、

さすがの私も、とうとう気付いてしまった訳ですよ。

これ、かなりムダなことしてない?

プラグインでなんとかなる系なんじゃない?

ルー買って圧力鍋に放り込んだら、終わるくない?

と、いうことで、私は目次プラグインを入れることにしました。

早速とあるプラグインを入れたのです。

ですがこのプラグインでは、id名に見出しがそのまま入る仕様で、カスタマイズできませんでした。

もちろん、見出しは「日本語」なので、id名がエンコードされ、やら長い文字列になってしまったのです。

普段からコーディング時に「いかにシンプルに書けるか」を重んじている私は、

こ………………

これはどうしても受け入れられない

と、なってしまい、プラグインで見出しを自動化することをこの時に諦めました。

第2章:プラグインとの出会い

私はしばらく、ぐつぐつシチュー状態を継続しておりました。

私は文章を読むことが好きで、気になったことはとにかく調べることが好きなので、色々な人のブログを覗かせていただいておりました。

ブロガーの方は

自力で目次を作っている訳がない!

という偏見から、他の方のブログの目次のソースをコーダーの持ちブキである[検証ツール]でチェックしていました。

そしてある時出会ったのです。

idがシンプルな目次に

おお、これはーーーーーーーーーーーー

私が探していた、プラグインなのでは・・・

私は恐る恐る、プラグインなのかどうか確かめるために、HTMLを見つめました。

この私の目は誤魔化せないわよ

覚悟しなさい

シュタタタタタタタタッ(見てるだけ)

このtocってプラグインくさい。

ていうか、絶対プラグインやん!

私は逃しませんでした。

すかさず「toc_list プラグイン」と検索。

はい、めちゃくちゃ出ました〜!

そこで、このプラグインを早速導入してみました。

第3章:TOCとのお付き合いが始まる

Table of Contents Plusというプラグインを使ってみると、便利すぎて困惑しました。

今まで時間をかけてシチューを煮込んでいた私ですが、材料ぶち込んで「ピ」て押すだけ状態。

なんならブログ書いて「ピ」すら押さずに自動で目次ができているという神様ぶり・・・

私が一番推したいところは、

アンカー(id名)が、シンプルなところ!!!!!!!!!!

こちらの目次のコードを見てみます。

驚かないでくださいよ〜〜

短い!

はい、短いーーー

「#i」「#css」「#tiktok」

アルファベットで始まる見出しはアルファベットにしてくれていて、日本語見出しは、自動で変換してくれています。

日本語の、「i」のところは自分で設定できます。

設定のここで、好きなアルファベットに変更できます。

ちなみに、ここでCSSをカットすることが可能です。

私は元々書いていた目次用CSSをムダにしたくなかったので、こちらにチェックをしています。

使い方はいちいち書くほどでもないくらい簡単なので、プラグインインストールして有効化してみてください。

いや雑

いいなと思ったら
TAPしてね♡↓

コメントする

CAPTCHA


コメントは承認後に表示されます。

Home Webデザイン WordPress 【WordPress】目次を自動表示するプラグイン、Table of Contents Plusを使ってみたら神でした

関連記事

更新通知を受け取る

不定期更新の為、
メールにて更新お知らせを
お送りいたしますlove letter

(更新通知以外のメールは
お送りしませんので
ご安心ください)