WordPressでブログを書いている人の記事をみていて、よく見かける
目次というやつがあります。

この記事で作っているので参考に

目次があると、
・読者の目を引くことがができる
・読者が求めている情報があるか？目次の時点で判断できる
・書くほうも整理して記事を書くことができる
と、記事を書く人・読む人にとってメリットが大きいです。

これどうやって作ってるの？って思って色々とgoogleさんに聞くと「Table of Contents Plus」というプラグインを入れるのが良いみたいだけど・・・
詳しくはこちらの記事に解りやすく載ってます

わたしのようなIT音痴には、プラグインを入れるのが抵抗があるので
HTMLで簡単に作れないかなぁと思ったあらありました！
備忘録も兼ねてここに記事としてまとめました。

ワードプレスの目次を作るHTML

雛形を置いているので、どうぞ！

まずは文章のはじめの部分に

<h2>目次</h2>
<ol>
<li><a href=”#title1″>タイトル①</a></li>
<li><a href=”#title2″>タイトル②</a></li>
<li><a href=”#title3″>タイトル③</a></li>
<li><a href=”#title4″>タイトル④</a></li>
<li><a href=”#title5″>タイトル⑤</a></li>
</ol>

を打ちます
タイトル①とか②とかは各段落の文章を入れてください。

そして各段落に下記を入れます。

<h2 id=”title1″>１.タイトル ①</h2>
<h2 id=”title2″>２.タイトル②</h2>
<h2 id=”title3″>３.タイトル③</h2>
<h2 id=”title4″>４.タイトル④</h2>
<h2 id=”title5″>５.タイトル⑤</h2>

そうすると、目次のタイトルをクリックするとそこにジャンプして表示してくれます。
こちらの記事ように表示されます。

ぜひ使ってみてくださいね

青貝 夕子