<< YuoTubeを高画質でダウンロードするサービスを調べました
Firefoxのツールチップを半透明にカスタマイズ >>
  1. HOME
  2.  > -
  3.  > スポンサーサイト

スポンサーサイト

  • 2016.11.05 Saturday
  • -
  • Permalink
    • -
    • -
    • by スポンサードリンク

一定期間更新がないため広告を表示しています

  1. HOME
  2.  > アドセンス
  3.  > JUGEMで記事下にAdSenseを表示させる方法

JUGEMで記事下にAdSenseを表示させる方法

  • 2009.06.01 Monday
  • 01:48
  • アドセンス
  • Permalink
    • comments(0)
    • trackbacks(0)
    • by ポンポン

ジュゲムブログにアドセンスを表示したいでど表示場所に迷っておられる方、多いのではないでしょうか。

これまで、このブログでも記事下に表示させて下りましたが、より柔軟に表示させる方法を試してみます。
方法は、フリースペースを使う方法です。

この方法により、JUGEM独自タグにより繰り返しになる場合がありました。しかし、繰り返しの範囲内でもフリースペースの中だけは一度だけ表示させることが出来るようになります。

フリースペースを使い記事の下にアドセンスを表示させる方法

JUGEMの管理画面より[デザイン] [HTMHTML・CSS編集]と進み、HTML編集フォームの次の場所を探します。

<!-- BEGIN freespace5 -->
	<dl>
	<dt>{freespace_title5}</dt>
	<dd>{freespace_contents5}</dd>
	</dl>
<!-- END freespace5 -->

<!-- BEGIN freespace5 -->から<!-- END freespace5 -->までをカットし
<!-- END entry_sequel_items -->の後にペーストします。

テンプレートにより{freespace_title5}と{freespace_contents5}は使われ方が違うと思いますので、

<!-- BEGIN freespace5 -->
	{freespace_contents5}
<!-- END freespace5 -->

この様にフリースペースタイトルを削除し、変更するのも良いです。

これで[HTMLを編集]をクリックするとフリースペース5の場所が記事下に移動します。

JUGEMの管理画面より[デザイン] [フリースペース]と進み、現在フリースペースが空きスペースになっているところの編集画面に進みます。フリースペースは全部で5個ありますので、最後の5を選ぶと良いかもしれません。今回の例でも5を使っています。

CSSを使ってAdSenseを左右に並べる

フリースペース内にAdSenseコードを含めたタグを貼り付けます。

<div class="ads">
	<p>Sponsored links</p>
	<div class="adl">
ここにアドセンスコードを貼る
	</div>
	<div class="adr">
ここにアドセンスコードを貼る
	</div>
</div>

CSS編集フォームに以下を追加します。

250x250を左右に並べる場合のCSSです。違うサイズを並べる場合は、.adsのwidthの値を変更してください。

.ads {
	float: left;
	width: 505px;
	margin: 15px auto;
	text-align: center;
}
.ads .adl {
	float: left;
	margin: 0 2px 0 0;
}
.ads .adr {
	float: left;
	margin: 0 0 0 2px;
}
.ads p {
	margin: 5px auto;
	text-align: center;
	color: #888;
}

このブログにもフリースペースを使って記事下にAdSenseを表示させてみました。ブログの場合、記事下への広告の反応が良いという記事を他でも多数見受けられます。2009年6月1日現在はAdSenseを記事下に表示させていますが後に変更するかもしれません。

フリースペースはトップページやカテゴリ別、アーカイブページでも繰り返さないという新たな発見をしました。AdSense以外でも活用できそうです。

参考にさせてもらった記事
  1. HOME
  2.  > -
  3.  > スポンサーサイト

スポンサーサイト

  • 2016.11.05 Saturday
  • -
  • Permalink
    • -
    • -
    • by スポンサードリンク
コメント
コメントする

   
この記事のトラックバックURL
トラックバック
Access Ranking
ブログパーツ
Search this site.
Calendar
      1
2345678
9101112131415
16171819202122
23242526272829
3031     
<< December 2018 >>
Categories
Selected entries
Recent comment
Recent trackback
Profile
Recent
Recent
現場のプロから学ぶXHTML+CSS
現場のプロから学ぶXHTML+CSS (JUGEMレビュー »)
益子 貴寛,堀内 敬子,小林 信次,千貫 りこ,伊藤 学,山田 あかね,西畑 一馬
Links
Software
カラメル
Sponsored Links
Mobile
qrcode
Others
Powered
  • みんなのブログポータル JUGEM

pageup