ピエールの日記 by pierre 長尾和美

ピエールです。SamuraiTraditional(サムトラ)、たけしを(逸見泰典とのユニット)でギターやってます♪思いつきをブログに! ^^v by pierre

WordPress – プラグイン – 記事の見出しに目次をつくる Table of Contents Plus

      2017/10/25

自分のこのブログなんかは自分へのメモ程度のものしか使っていないので、特に目次とか、そういったものは気にもしていませんでした。

強いて言うならば、自分はランダムなネタで書いてしまうので、その記事の目次を作ってカスタマイズできれば良いなぁ。。くらいにしか思っていませんでした。

ところがこんな自分のメモ的ブログでもときどき投稿が長くなってしまうことがあります。

特に最近、画像を大目にするようにしていますし、「引用」を覚えてしまったので、今後バシバシ使っていくようになるでしょうから、やっぱり記事内でも目次があったほうが見やすいかも知れない。。。と、思うようになってきました。

そんなわけで、調べてみて、導入したのでメモです。

目次

Table of Contents Plus

調べてみましたが、こちらの「Table of Contents Plus」というプラグインが圧倒的に多いですね。

他のプラグインが出てこないようですが。。

とりあえずこのプラグインをインストールして有効化してみました。

インストールはいつものごとく、Wordpressの管理画面から「プラグイン」→「新規追加」で、「Table of Contents Plus」を検索してインストール。ですね。

早速「設定」→「TOP+」を開いてみました。

「TOP+」は「Table of Contents Plus」の略なんですね。

20141029012

どこに目次を入れるの?

20141029013
③「Auto insert for the following content types」

まず、こちらは設定しておくとよいでしょう。

デフォルトでは「page」(固定ページ)になっています。

こちらの「post](記事)はチェックを入れておくとよいでしょう。

ちなみに、自分の場合、目次を入れられるのは3択になっています。

「post」(記事)、「page」(固定ページ)、「wpcf7_contact_form」(Contact Form 7というプラグインを入れているから出ているのでしょうか。メール問合せのようなコンタクトフォームを作るプラグインですが。。そちらに目次を入れるということでしょうか。)

①「position」

どこに配置するかを決めます。こちらは4択になっています。

「Before first heading」一番初めの見出しの前。デフォルト。

「After first heading」 一番初めの見出しの後ろ。

「Top」 記事の一番上。

「Bottom」記事の一番下。

自分はデフォルトにしました。

どうしたら目次ができるの?

②「Show when」

ここで目次ができるための条件を設定しますが、目次が表示される条件はheadings(<h2>とか<h3>とか)が記事内にいくつあるか、で判断されます。

例えばここで「4」と設定した場合、記事内に<h2>とか<h3>とかが合計で「4」個以上あれば目次が現れてきます。

*Stingerを利用している場合、記事のタイトルに<h1>が使われていますが、こちらはタイトルなのでカウントされていません。あくまでも記事の内容のなかでいくつ使われているか。になります。

どんな風に見えるの?

とりあえずこんな感じの目次があります。

20141029014

番号は対応していますが、設定画面は下記になります。

20141029015

④「Heading text」

⑤のチェックボックスですが、これにチェックを入れておくと目次のタイトルが表示されます。

デフォルトでチェックがついていたのでそのままにしています。

⑥で目次のタイトルを決めます。「目次」に書き換えました。

⑦のチェックボックスですが、⑧の「表示」や⑨の「非表示」リンクを表示するか表示しないかを決めます。

デフォルトでチェックがついていたのでそのままにしています。

⑧と⑨で表示の場合と非表示の場合の文言を決めますが、⑧は「表示」、⑨は「非表示」に書き換えました。

⑩でこの目次はデフォルトで表示させるのか、表示させないのかを決めます。

デフォルトでチェックが外れていたのでそのまま表示させることにしています。

⑪「Show hierarchy」

デフォルトでチェックがついています。

チェックをはずすと、下図のように、段落の段組みがなくなります。

20141029016

⑫「Number list items」

デフォルトでチェックがついています。

チェックをはずすと、下図のように、目次の番号がなくなります。

20141029017

⑬「Enable smooth scroll effect」

これは目次内のリンクをクリックしたときに、ぱっと飛んでいくのか、スクロールしながら飛んでいくのかを決められます。

デフォルトではチェックがはずれていますが、なんとなく印象でチェックをつけておきました。

20141029018

⑭「Appearance」

こちらは見た目的なところでしょうか。

⑮は幅を設定できますが、自分の場合はデフォルトのままです。

⑯は目次を記事内の右側につけるか、左側につけるかを選択できます。

デフォルトと左側につけるのとだとどう違うのかがよくわからなかったのですが、自分の場合はとりあえずデフォルトにしました。

⑰はフォントを設定できますが、自分の場合はデフォルトのままです。

⑱は見た目のフォーマットを選択できるようになっています。

お好みで選択してみてください。

まとめ

そんなわけで、目次の設定ができました。

この記事にも目次ができて見やすくなったと思います。

wordpressで記事の見出しに目次を作るにはプラグインの「Table of Contents Plus」を入れると簡単で便利。ということですね。

 - Web, wordpress, プラグイン , , ,