« 八景島シーパラダイスの混雑予想 | Main | ハイクブログ »

July 19, 2005

GoogleAdsenseを記事に埋め込む

前々からこれがやりたくて、ちょっとやってみたりしたのですが、何故か表示されずそのまま放ってました。
でも1ヶ月ぶりのBLOG再開で気力がみなぎっているうちにこの問題を一気に片付けてしまおうということで、片付けちゃいました。

まず現状の問題点は、GoogleAdnsenseのコードを記事の末尾に埋め込んでもAdsenseが表示されないです。これをインターネットでいろいろ調べてみると、ココログの標準設定では、行の末尾に<br>タグが自動的に挿入されてしまい、これによってAdsenseが表示されなくなることが判明。

↓こんな風になってしまいます。
<p><script type="text/javascript"><!-- <br />
google_ad_client = "pub-7288204297016152";<br />
google_ad_width = 468;<br />
google_ad_height = 60;<br />
google_ad_format = "468x60_as";<br />
google_ad_type = "text_image";<br />
google_ad_channel ="3865125860";<br />
google_color_border = "FF4500";<br />
google_color_bg = "FFEBCD";<br />
google_color_link = "DE7008";<br />
google_color_url = "E0AD12";<br />
google_color_text = "8B4513";<br />
//--></script><br />
<script type="text/javascript"<br />
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script><p>

これを回避する手立てとして、ココログ管理の表示設定画面の「記事のオプション設定」項目中の「テキストフォーマットの初期設定」の設定値を「改行を反映させる」から「なし」に変更し、この設定をBLOGの全てのドキュメントに反映させる、という方法があります。

しかしこの方法だと、これまで書き溜めた全ての記事の改行コードが無視されてブラウザに表示されることになるため、全ての記事の改行箇所に<br>タグを手動で埋め込まなければいけません。事実上不可能です。

そこで、インターネットで、ココログの記事にGoogleAdsenseを埋め込んでいる方を探してみました。

■パソコントラブル出張修理・サポート日記:
 「ココログで記事の最後にGoogle AdSenseを入れるには。
■WADA-blog:
 「ココログの記事下に「Google AdSense」を挿入する

やはり結構この問題で苦労されている方は多いようです。しかも、ココログプロ(有料コース)でないとダメと諦めている人もいるみたい。でもそんなことはありません。無料のココログでもGoogleAdsenseは記事に埋め込めます!

というわけで、現在BLOGページで使っているスタイルシートに手を加え、GoogleAdsenseのコードをある特定のタグで挟むことにより、そのタグ間のテキストには末尾に<br>タグが付かないように細工するという方法で、この問題を解決します。

自作スタイルシートのダウンロード・アップロードの方法については、フルカワマサユキさんが運営している詞織のBLOGページなどを参考に行ってみて下さい。

それで、スタイルシートをダウンロードした後で、そのスタイルシートをテキストエディタで開き、どこでも良いので以下の記述を追加します。

.content DIV.google
{
}

テキストエディタを保存終了し、このスタイルシートをアップロードします。

次に、GoogleAdsenseを挿入したい記事を開き、GoogleAdsenseを表示させたい場所に以下のようにGoogleAdsenseコードを埋め込みます。

<div class="google">
ここに、GoogleAdsenseコードを貼り付けます
<div>

最後に記事を保存し、ブラウザから表示させれば、GoogleAdsenseが表示されるようになります。

あとオマケですが、ココログで提供しているテンプレートでは、3列表示だと中央列の幅が狭く、460×60サイズのGoogleAdsenseが収まりません。(自分的にはビジョーに不満(-.-))
そこで、ココログの標準デザイン(確か出発点は"山手線[3列]"だった気がします)をベースに、「ペーパカット」のデザインをミックスしたスタイルシート(このBLOGで2005年夏バージョンとして使っているものです)をこちらにアップロードしておきますので、欲しい方はコメントを残して頂くことを条件にご自由にお使い下さい。改変もご自由にどうぞ。このスタイルシートは中央列の幅が500pxに設定してあるので、460×60サイズのGoogleAdsenseもぴったり収まります。

「mystylesheet.css」をダウンロード
※本記事紹介した方法を試した結果として不都合・不具合が生じても、責任は負いかねますので自己責任の範囲でお試し下さい。

|

« 八景島シーパラダイスの混雑予想 | Main | ハイクブログ »

「ウェブログ・ココログ関連」カテゴリの記事

「パソコン・インターネット」カテゴリの記事

Comments

トラックバックありがとうございました。
なるほど…色々やり方はあるもんですね。

でも、ココログプロで色々いじれるようになったことがわかって、もうすでに色々いじってますので(笑)もう元には戻せません。

日々勉強ですね。

Posted by: ささもと | July 19, 2005 at 11:01 PM

ささもとさん、こんにちは。
コメントありがとうございました。

私もブログを始めてちょうど1年くらいですが、ようやくスタイルシートの仕組みがわかってきたところです。
ほんと、日々勉強です。(^^)

Posted by: あるご | July 20, 2005 at 07:10 PM

Post a comment



(Not displayed with comment.)


Comments are moderated, and will not appear on this weblog until the author has approved them.



TrackBack

TrackBack URL for this entry:
http://app.cocolog-nifty.com/t/trackback/42070/5051665

Listed below are links to weblogs that reference GoogleAdsenseを記事に埋め込む:

» 「Google AdSense」の挿入 [藤の田圃]
現在、記事の本文内に「Google AdSense」を挿入する場合、毎回手動で貼 [Read More]

Tracked on February 26, 2006 at 11:18 PM

« 八景島シーパラダイスの混雑予想 | Main | ハイクブログ »