ブログ

ブログに目次を表示させる方法と余計な項目を消す方法

色々と他の方のブログを拝見していて、ふと思いました。

「目次があった方がかっこいい!」

早速目次を入れてみましたが、余計な部分まで目次に入ってしまうという困ったことも起こりました。

今回は、目次の作り方とその対処法をご紹介いたします。

目次を作る

JINというテンプレートを使っています。

目次の作り方は、そのサイトを参考にさせてもらいました。

https://jin-theme.com/manual/mokuji/

紹介された手順通りに設定したところ、無事目次は表示されました。

他のテンプレートを使っていても問題ないと思います。

余計な項目を消すには

無事目次は出来て満足していたのですが、今日になって困ったトラブルが起こりました。

目次の最後におかしな項目が入っていたのです。

「・共有:」と「関連」という文字です。

JetpackがOFFなら問題なし

目次を作った時、たまたまJetpackというプラグインをOFFにしていました。

理由はサムネイル画像が表示されなかったからです。

詳しくはこちらから。

ブログに画像が突然表示されなくなった時の対処今日は休みのため、色々とブログをいじりました。記事も書きました。 「今日はよく頑張った」と思い一休みし、ふとスマホで自分のサイトを...

様子見で、数日してからJetpackを復活させたところ、サムネイル画像のトラブルは解消されていました。

「一安心」と思ったのも束の間、今度は余計な項目が目次に表示されるようになりました。

どうやら、共有ボタンの前についている「共有:」と、関連項目の前についている「関連」という項目を拾ってきているようでした。

確かに、HTMLファイルを見ていると、上記2つには<h3>タグが付いています。

おそらく、JetpackをONにすると、すべてのヘッダー項目を拾ってしまうのでしょう。

逆にOFFにした場合になぜ拾わないのかわかりませんが、JetpackをOFFにすると上記の項目は目次から消えました。

JetpackがONのまま解決する方法

JetpackがOFFだと、Twitterとの連携がうまくいきません。

何とかONのまま、余計な項目を消せないものかと見たところ、目次作成用プラグイン(TOC+)の設定欄に解決策がありました。

ただし、「上級者向け」となって隠れています。

以下の手順で、余計な項目を目次から消すことができます。

除外する見出しに、取り除きたい項目を入力します。

区切りは「|」(パイプ記号)です。

スペースはいりません。

完全一致する文字を除外しますので、「共有」と設定すると除外されませんでした。「共有:」で消せます。

 

同じようなトラブルでお困りの方の参考になれば幸いです。

ABOUT ME
カメ
カメ
カメです。 のんびり屋でも、自由に生きていける世の中を目指して、色々考えていきます。 中学受験算数と理科の指導を何年もしていました。 その経験を生かして、分かりやすい記事を書いていければと思います。 趣味はロードバイクです。愛車はMERIDAのSCULTURA 700です。江戸川や利根川沿いを走っています。Zwiftもやっています。 最近は投資にはまっています。まずは楽天証券口座での投資信託。そしてMT4を使ったFXの自動取引。最近はソーシャルレンディングもおもしろそうだと思っています。株の自動売買もやってみたい。 世の中、面白いことがたくさんありますね。これから世界がどのようになっていくのか、とても楽しみです。 よろしくお願いいたします。