広告

posted by fanblog
「ここにブログの名前を入れます」は更新を終了しました。記事はすべて新ブログ「Big Bang」に移転済みです。記事のタイトルをクリックすると新ブログの該当記事に移動します。そちらでお楽しみください。

記事の真下に広告を貼る方法

こんばんは「ここにブログの名前を入れます」略して「ナマ入れ」です。

以前、「広告がもっともクリックされる場所」という記事で、このブログでは、記事終了直後の広告がいちばんクリックされるという理由を書きました。

今回は、その場所にアフィリエイトを貼る方法を書きます。

変更するのは、スキンの「1記事」です。

まず、「投稿者:」という文字を目印に次の場所を探します。

下は、横幅の関係で、何行もあるように見えますが、実際は「投稿者:」の行がとても長いと思いますので、注意して探します。

投稿者:<a href="{$BlogEntryWriterUrl$}" target="_blank">{$BlogEntryWriterName$}</a>|{$BlogEntryDate format="%H:%M"$}<BlogEntryIfCategory>|<a href="{$BlogEntryCategoryLink$}">{$BlogEntryCategory$}</a></BlogEntryIfCategory><BlogEntryIfAllowComments>|<a href="{$BlogEntryPermalinkUrl$}#comments">コメント({$BlogEntryCommentCount$})</a></BlogEntryIfAllowComments><BlogEntryIfAllowPings>|<a href="{$BlogEntryPermalinkUrl$}#Trackback">トラックバック({$BlogEntryTrackbackCount$})</a>	 </BlogEntryIfAllowPings><BlogEntryIfAllowEntryRatings><span class="rating">|評価平均{$BlogEntryRatingAverageStar$}({$BlogEntryRatingAverage$})  |評価数({$BlogEntryRatingCount$})</span></BlogEntryIfAllowEntryRatings>
</div><!-- entryInfo -->
</div><!-- entry -->
<BlogEntryIfAllowPings>

そのすぐ下には、次の場所があるはずです。目印は「トラックバック」という文字です。

<h3 id="trackbackTitle">トラックバック</h3>

その2つの間に、アフィリエイトを貼り付けます。

実際の、このブログのコードは以下の通りです。

投稿者:<a href="{$BlogEntryWriterUrl$}" target="_blank">{$BlogEntryWriterName$}</a>|{$BlogEntryDate format="%H:%M"$}<BlogEntryIfCategory>|<a href="{$BlogEntryCategoryLink$}">{$BlogEntryCategory$}</a></BlogEntryIfCategory><BlogEntryIfAllowComments>|<a href="{$BlogEntryPermalinkUrl$}#comments">コメント({$BlogEntryCommentCount$})</a></BlogEntryIfAllowComments><BlogEntryIfAllowPings>|<a href="{$BlogEntryPermalinkUrl$}#Trackback">トラックバック({$BlogEntryTrackbackCount$})</a>	 </BlogEntryIfAllowPings><BlogEntryIfAllowEntryRatings><span class="rating">|評価平均{$BlogEntryRatingAverageStar$}({$BlogEntryRatingAverage$})  |評価数({$BlogEntryRatingCount$})</span></BlogEntryIfAllowEntryRatings>
</div><!-- entryInfo -->
</div><!-- entry -->
<BlogEntryIfAllowPings>

<!--naviここから-->
<p style="width:100%;line-height:2em;margin-top:-2em;" class="navi">
<BlogArchivePrevious>
<span style="float:left">&lt;&lt; <a href="{$BlogArchiveLink$}" title="{$BlogArchiveTitle$}">前の記事</a></span>
</BlogArchivePrevious>
<BlogArchiveNext>
<span style="float:right"><a href="{$BlogArchiveLink$}" title="{$BlogArchiveTitle$}">次の記事</a> &gt;&gt;</span>
</BlogArchiveNext>
</p>
<!--naviここまで-->

<!-- Google AdSense ここから -->
<div style="width:336px;margin:0 auto">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-8610957838436107";
/* なまいれ336x280 */
google_ad_slot = "0165168627";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<!-- Google AdSense ここまで -->

<h3 id="trackbackTitle" style="clear:both">トラックバック</h3>

青い部分は、このブログに設置している「<<前の記事」と「次の記事>>」というナビゲーションです。

最後のh3タグの中にstyle="clear:both"と書いてあるのは、ナビゲーションの中で、floatを使っているから、それをクリアするためです。

ナビゲーションの下のピンク部分が、アフィリエイトです。このブログでは、横幅336ピクセル、高さ280ピクセルのGoogle AdSenseです。

上のソースをそのまま貼り付けると、クリックされた時に、収益が私のものになるので、自分のものを貼ってください。

<div style="width:336px;margin:0 auto"></div>の間にアドセンスのソースを貼り付け、style="width:336px;margin:0 auto"というスタイルシートで真ん中合わせにしています。

アフィリエイトがscriptタグでなく、aタグの時は、style="width:336px;margin:0 auto"
style="text-align:center"に変更すれば、真ん中合わせに出来ます。

実際の表示結果は、この記事の、すぐ下で見られます。

新ブログ「Big Bang」で続きを読む