2007年05月23日
広告をテンプレートに挿入して、自動で表示させる
今回は、アフィリエイトなどの広告を自動で挿入するカスタマイズを紹介します。全てのエントリに同様の広告を掲載する場合などならば、記事に広告コードを入れるより簡単です。
また、他のサイトへのリンクなどなら、テンプレートに挿入しておいた方が楽かもしれまん。これなら簡単に全ページのリンクが自動で書き換わります(記事の場合は該当記事全部を書き換える必要がある)。
それ程難しくありませんし、テンプレートの挿入箇所さえわかれば、他のFC2ブログ用テンプレートを使用していても利用可能です。
いくつかパターンがありますので、使用目的に合わせて選んで下さい。
1.固定リンクページに広告を貼り付けるカスタマイズ
この場合、本文を追記にしておいて、続きを読むのリンク先で表示するページに広告コードを貼り付ける形になります。
htmlのカスタマイズ(追加)箇所
<!--more-->
<a name="more"></a>
<div class="maincontent"><!-- 追記本文 -->
<%topentry_more>
</div><!-- maincontent -->
<!--/more-->
<!--permanent_area-->
<div class="mainad">
<a href="<%url>">広告リンク</a>
</div><!-- mainad -->
<!--/permanent_area-->
<div class="maintag"><!-- タグ表示 -->
<!--topentry_tag-->
タグ : <%topentry_jointtag>
<!--/topentry_tag-->
</div><!-- maintag -->
cssのカスタマイズ(追加)箇所
.mainad{
margin-top: 10px;
font-size: 12px;
color: #000;
line-height: 1.5;
}
仕組みとしては、固定リンク画面に移ったときのみ表示するための変数、permanent_area内に広告コードを貼っているだけです。ここではタグ表示の上に表示して、かつスペースもcssによって空けていますが、ここを本文と追記の間においたり、あえて本文記事とつなげて表示したりもできます。表示箇所及び、広告用のコードは適宜変更してください。例ではブログのトップページへのリンクを表示しています。
2.トップページの追記の前に広告を貼るカスタマイズ
よく見かけるパターンですが、これをテンプレートで行ってみましょう。
<!--more_link-->
<div class="mainmore">
<!--index_area-->
<a href="<%url>">広告リンク</a><br />
<!--/index_area-->
<a href="<%topentry_link>#more" title="「<%topentry_title>」の続きを読む">…続きを読む</a>
</div><!-- mainmore -->
<!--/more_link-->
実は簡単で、追記を表示する箇所に広告のコードを貼り付けるだけです(スペースを取らない場合)。例の赤部分が広告のコードで、青の部分はトップページのみの表示にする場合(検索、カテゴリなどでも表示するなら外す)の表記です。
3.各エントリの最後に貼り付けるカスタマイズ
1のパターンは追記の場合でしたので、普通に追記無しの場合でエントリの下部(フッターの前)に広告をテンプレートに貼り付けるカスタマイズです。
htmlのカスタマイズ(追加)箇所
<!--more-->
<a name="more"></a>
<div class="maincontent"><!-- 追記本文 -->
<%topentry_more>
</div><!-- maincontent -->
<!--/more-->
<div class="mainad">
<a href="<%url>">広告リンク</a>
</div><!-- mainad -->
<div class="maintag"><!-- タグ表示 -->
<!--topentry_tag-->
タグ : <%topentry_jointtag>
<!--/topentry_tag-->
</div><!-- maintag -->
cssのカスタマイズ(追加)箇所
.mainad{
margin-top: 10px;
font-size: 12px;
color: #000;
line-height: 1.5;
}
勘のいい方はお分かりかもしれませんが、固定リンク画面のみ表示する変数を削除するだけです。これで、自動的にエントリ下部に指定した広告が表示されるようになります。
テンプレート中で使える変数一覧という公式のページがありますので、特定のページのみ表示する変数などを使用する場合に参考にしてみて下さい。