目次・アドセンスを設定する方法について
当サイトのテンプレートでは、記事内にアドセンスや目次を入れることができます。
使い方に癖があるので、初心者の方向けに方法をまとめておくことにします。
機能の仕組
表示位置について
テンプレートの機能である「自動目次」と「記事中アドセンス」は、<!--more-->タグの記入された場所の上に表示される仕様になっています。ですので、この機能を正常に使うには記事に<!--more-->タグを挿入しなければなりません。
<!--more-->タグとは、Bloggerにおいて「続きを読む」を挿入するためのタグで、記事リストに記事が丸々表示されるタイプのテンプレートにおいては「続きを読む」を表示させ、<!--more-->タグ以降の内容を隠す役割があります。
<!--more-->タグは「作成ビュー」から記事を作成する場合は上部のアイコンの中に挿入ボタンがあります(「追記を挿入」というやつ)。「HTMLビュー」の場合は自分で<!--more-->と記述する必要があります。
Bloggerの新UI移行に伴って作成ビューで<!--more-->タグを挿入すると上記の機能がうまく動かないバグが発生する可能性がありますので、個人的には「HTMLビュー」で<!--more-->タグを自分で記述する方法がおすすめです。
また、「<!--more-->」という文字列をお使いのPCに「もあ」などで辞書登録しておくと呼び出しが楽になるのでオススメです。
記事内での<!--more-->タグの使用例
文章<br />
<br />
<!-- ここに目次・アドセンス機能が表示される -->
<!--more-->
<br />
<h2>大見出し</h2>
<br />
<h3>中見出し</h3>
<br />
文章<br />
<br />
※<!-- ここに目次・アドセンス機能が表示される -->は記述不要です
自動目次機能
自動目次機能は、記事内に「<!--more-->タグがある」かつ「<h2>タグ」がある場合のみに表示される仕様になっています。また、目次は記事内に設置された<h2>~<h4>までの見出しから生成される仕様になっています。
ですので、目次を表示したい記事を作りたい場合は、
・目次表示位置に<!--more-->タグを入れる
・記事内に<h2>見出しを使う
という条件をすべてクリアした記事を作ってください。
※デフォルトでは固定ページには非対応ですので、ご自身でテンプレートの編集から条件分岐を書き換えてください
記事中アドセンス機能
記事中アドセンス機能は、<!--more-->タグの上に<div class='ad1' id='ad1'>~</div>の要素を表示させるというものになっており、自動目次機能を使用されている場合は、その下に位置する仕様になっています。
<div class='ad1' id='ad1'>~</div>の~部分にアドセンスコードを記述することで、<!--more-->タグの上にアドセンス広告を表示させることができます。<div class='ad1' id='ad1'>~</div>に何も記述しなければ、この機能は他に影響しません。
詳しくは「記事中・記事下のアドセンスの設定方法」を参照してください
トラブルシューティング
今まで書いてきた記事に<!--more-->タグを設置し忘れていた
1.すべての記事に<!--more-->タグを挿入する
2.自動目次機能・記事中アドセンス機能を諦めて「目次なし版」を使う
<!--more-->タグの意味がわからない
・自動目次機能・記事中アドセンス機能を諦めて「目次なし版」を使う
<!--more-->タグを入れたのにちゃんと機能しない
Bloggerの新UIで「作成ビュー」から<!--more-->タグを入れた場合、HTMLにおける<!--more-->タグが
<span><!--more--></span>
になっているかと思われます。この状態では機能しないので「HTMLビュー」から上記の部分を
<!--more-->
に書き直してください。