【TOC+】記事毎に目次の見出しの表示レベルを上げるのをやめて逆にした

いまになって思うことは、目次の表示も見出しの数も、好きなようにやればいいじゃないか、ということでした。

WordPressで運営しているブログに目次を表示させる方法として、「TOC+（Table of Contents Plus）」という便利なプラグインがあります。

同プラグインは、記事ごとに表示させる見出しタグ（h2、h3など）を選ぶことができ、特定の文言の見出しを表示させないこともできるなど、プラグインなし（自作）では手が届きにくいようなこともできるため、当ブログではこのプラグインを利用しています。

しかし最近になって、見出しを多く出したい（h2～h4など）記事だけをショートコードで指定し、表示のレベルを上げてきたやり方に疑問を感じ始め、見出しを少なく出したい（h2のみなど）記事だけをショートコードで指定し、表示のレベルを下げるやり方に変更することにしたので、よく意味がわからないかもしれませんが、今回行った作業をここに残しておきたいと思います。

ブログに目次はいらないという不要説

ブログに目次は必要か否か。

現在は、目次があると全体を把握しやすい、調べごとをしているときなどは見たい場所にジャンプできる、そしてなにより、目次として表示している見出しが、検索結果にも表示されるため、SEO（記事の検索順位に大きく関わるもの）への観点からも、目次は必須という考え方のほうが多いように思います。

ところが、見出しはいらないとする不要論もあります。

不要派の意見としては、そこまで文字数が多くないブログの記事では目次は必要ない、目次が長い、またはネタバレしてしまうと読む気がなくなる、離脱率が上がる、といったところでしょうか。

私としては本を読む際も、なんとなく全体の流れを把握してから読みたいと感じるので、個人的には目次はあったほうがいいと思っています。

不要派の意見である目次が長いというのは、逆に「情報の信頼度」につながることもあり、予備知識ゼロのまま読みたいという方には、目次の「閉じる」を押してもらえば、以後目次は非表示のままとなるので、デメリットとされるものも、さしたる問題ではないと感じられ、回避することもできるからです。

しかし、そう思うのはいまだからこその話であって、ブログ開設当時の私は、メリットよりもデメリットのほうを気にしてしまっていました。その結果として、今回のようなよくわからない事態が起きてしまったのです。

見出しの表示レベルを最小にしていた

ブログに目次を設置する場合、見出しタグは「h2～h3」までの2つを表示させるのが一般的となっていますが、当時の私は、見出しが長くなることで離脱率が上がるのを恐れ、見出しは「h2」のみを表示させることにしていました。

しかし、記事を書いているうちに、「h3」まで表示させたいと思うことが出てきたため、そのときにかぎっては、見出しタグを「h2～h3」まで表示させることにしていたのです。

「TOC+」というプラグインでは、基本設定は「h2」までを表示としていても、以下のようなショートコードを記事内に入力することで、記事ごとに表示のレベルをいじることができます。

これによって、見出しを多く出したい記事はショートコードで目次を呼び出し、それ以外の記事は見出しを少なく表示させる、というのが私のスタンダードとなっていたわけですが、ここでちょっとした問題が起きました。

ショートコードで目次を呼び出すと、目次の「上」に自動で表示させていた広告が、目次の「下」にくるようになってしまったのです。

広告を目次上に自動表示させ、特定記事は除外する方法

これを解決するため、私は見出しを多く出したい（h2～h3まで出す）記事では、広告の自動表示を一度解除し、目次のショートコードの上に広告を手動で張るという方式をとることにしていました。

広告の自動表示（最初のh2の上だけ）と、特定の記事だけを解除するやり方は、わいひらさんという方が運営されている「寝ログ」さんの記事を参考にさせていただき、以下のコードを「functions.php」に記述することで実装が可能となりました。

/*アドセンス自動挿入*/
function add_ad_before_h2_for_1time($the_content) {
//広告（AdSense）タグを記入
$ad = <<< EOF
//ここにアドセンスのコード
EOF;

if (!is_single( array( 0000,0000,0000 ) ) && !is_page() ) {//()以外の投稿ページのみ広告を出す
 $h2 = '/^<h2.*?>.+?<\/h2>$/im';//H2見出しのパターン
 if ( preg_match_all( $h2, $the_content, $h2s )) {//H2見出しが本文中にあるかどうか
 if ( $h2s[0] ) {//チェックは不要と思うけど一応
 if ( $h2s[0][0] ) {//1番目のH2見出し手前に広告を挿入
 $the_content = str_replace($h2s[0][0], $ad.$h2s[0][0], $the_content);
 }
 }
 }
 }
 return $the_content;
}
add_filter('the_content','add_ad_before_h2_for_1time', 10);

（参考：【アドセンス収益向上】簡単！プラグインやショートコード不要でWordPress記事中に広告を挿入する方法）

コード中段の「array( 0000,0000,0000 )」という数字の部分に、除外したい記事のIDを入力することで、それ以外の記事だけに広告を表示させることができるというわけです（固定ページも表示しないようにしています）。

これによって、特定の記事だけ見出しを多く出し、広告の位置問題も解決することができたのです……が、今度は記事を書くにつれて、見出しを多く出したいと思うことがさらに増えていき、気づけばいつのまにか私は、新しく書く記事のほぼすべてを「h2～h3」まで表示させるようになっていました。

そのつど自動広告を外し、ショートコード・広告を設置するという、しち面倒くさいことを繰り返していたのです。

そこで思ったのが、見出しを多く出したい記事をそのようにするのではなく、見出しを多く出したくない（少なく表示したい）記事だけを、そのようにしたほうが早いのではないか、ということで、今回の作業が始まったわけです。

表示レベルの基本を「h2～h3」にする作業開始

今回の作業は、おおまかにいうと、見出しを多く出している記事（h2～h3）から、広告のコードと表示レベルを指定するショートコードを除去し、今度は見出しを少なく出したい記事（h2のみ）に、広告のコードと表示レベルを指定するショートコードを設置する、というものです。

ようはこれまでしてきたことを逆にする作業で、その手順としては、以下のようになります。

1. バックアップを取る
2. 「TOC+」の基本設定を「h2のみ」から「h2～h3」に変更
3. 見出し（多）の記事から広告とショートコードを除去
4. 「functions.php」から除外する記事IDを削除＆記述
5. 見出し（少）の記事に広告とショートコードを設置
6. 動作確認

この作業は、途中で間違えたり、やっぱりやめようとしたりすると、取り返しがつかなくなる作業だったので、作業前にはバックアップをとることにしました（実際に1回やめようとして復元した）。

そのあとで、「TOC+」の基本設定から、見出しの表示レベルを「h2～h3」に引き上げ、記事に設置した広告・ショートコードと、広告を除外してきた記事IDを削除。

見出しを少なくする記事にはそれとは反対のことをして、動作確認後、問題がなければ終了というものです。

以下、その作業の進行の、詳しい手順です。

TOC+の設定変更～ID・広告・ショートコードを除去

まずはバックアップを取ったのち、「TOC+」の設定画面から「上級者向け」のタブを開き、見出しレベルを「h2、h3」に変更。

「Search Regex」というプラグインを利用し、広告（グーグルアドセンス）のコードを「検索」。置換方法は「削除」を選択します。

このとき、最初に「すべて置換」を押してしまうと、確認もなしに作業が進行してしまうので、細心の注意が必要となります。

検索結果の画面で問題ないことを確認したら、そこで初めて「すべて置換」をクリック。

同様にして、見出しを多く出したいときに設置していた、「TOC+」のショートコードも削除していきます。

続いて、これまで「function.php」に記述することで、自動広告の表示を除外としてきた記事のIDを、すべて削除します。

ちなみに、数えてみたところ、170記事分くらいありました。いつのまにか、余裕で過半数を超えてしまっていたのです。

ここまでで、作業の3～4割くらいは終了となります。

全記事の確認～ID記述・広告・ショートコードの設置

さて、ここからが本番です。

記事を最初からすべて確認していき、このように見出しが長い、もしくは最低限で問題ないと感じる記事を探し出し、それが発見できたら、先ほどの「functions.php」の空いた部分に、記事のIDを書き込んで保存。

記事本文に広告と目次を表示するショートコード（今度は「h2」のみを表示させるので、指定する数字は [levels=”2″] ）を設置したら、記事を更新して動作確認。

これ（とくに前半の確認作業）をただひたすら、300回ほど繰り返すだけ。300回ほど繰り返すだけです。

とはいっても、見出しを少なくしたい記事のほうが少ないので、ほとんどは目次のチェック作業のようなものでした。

そして作業が完了してみると……

なんと、見出しの表示を抑えたほうがいいと感じた記事は、まさかの、たった7記事という結果に！（比較しやすいため行間を空けています）

いったいどれだけの時間が、これまで、ほとんど無駄に消えていたのでしょう。そもそも私は、これまでなにをしていたのでしょうか？

コードも気持ちもかなりスッキリしましたが、わずかながらモヤモヤしたものも残る、目次の表示レベル変更作業でした。

今回のまとめ

今回の作業は、これまでもやらないといけないと、たしか何度も考えていたような気がするのですが、結局先延ばし、先延ばしになってしまい、これだけの数になってしまったように思います。

いつも思うことですが、「これはやったほうがいいな」と感じたことは、感じたタイミングでさっさとやってしまったほうがいいのかもしれません。先延ばしにしていていいことというのは、基本的にはないような気がしますから。

手遅れになる前でよかったとしかいいようがありません。今回の作業を終えたことで、これからは格段に作業もはかどるはずなので、さらに気合いを入れていきたいと思いました。

また、これで最後となりますが、目次の表示・非表示、表示させる見出しの数なんかは、誰がなんといおうと、やはり自分の好きなようにやるのがいちばんだと私は思います。

ためしに自分でやってみれば、そこでなにかが起き、なにか感じるものがあり、なにかをしたいと思うようにもなるものです。人の意見は参考程度にとどめ、あくまでも最優先は「自分はどうしたいのか」。それを判断基準にすればいいのではないでしょうか。

ブログ開設初期の、目次をどうするかで悩んでいる自分にアドバイスができるのであれば、私はそのようなことをいうと思います。「やりたいようにやれ！」と。