こんにちは♪ わたぼんです。

 
アドセンス広告を記事の下に2つ横並びで設置しているブログってよく見ますよね?

 
“ダブルレクタングル”なんて呼ばれているそうです・・・(・ε・`。)ン?

 
こんな感じ

 

adsenseimage.jpg

 
おいらが目指したのは、

 
PC上では「336×280レクタングル(大)」を2つ表示させつつ、スマホ画面では推奨されてもいる「300×250レクタングル」を1つだけ表示させる

 
ということ・・・。

 
利用しているWordPressテーマは、バズ部オリジナルのフリーテーマ「Xeory base」ですが、設置画面の幅さえ十分にあれば、ほかのテーマにも対応できると思います・・・。

 
約束はできないけど、おいらも苦労してたどり着いた方法なんで、試す価値はあると思います。

 
でも、ダメだったゴメンなさい・・・|ω・)

 
そんなわけで、今回は、WordPressを利用している場合のコイツの設置方法と、注意するべきGoogleアドセンスのルールについてご紹介します♪

 

アドセンス広告の横並び表示の注意点

 
最初に注意するべきGoogleアドセンスのルールについてお話しします。

 
アドセンス広告を2つ横並びに表示できれば、ページが整頓されて見栄えが良くなりますよね。

 
でもこれ、スマホで表示されたときは縦に2つ続けざまに表示されちゃうんですよね。

 
実はこれ、Googleアドセンスの規約に反する状況なんだそうですよ。

 
だからおいらは、「PCでは2つ横並び、スマホでは1つだけを表示」させたいと思ったんですね。

 
で、PC画面上では、でっかい「336×280レクタングル(大)」を2つ並べて、スマホ画面上では、クリック率が高い上に推奨もされている「300×250レクタングル」を1つだけ表示するようにしようというわけです。

 
ご利用なさっているテーマのメインカラム(記事本文が表示される部分)の幅が狭いと、広告がはみ出しちゃいます。ポロリってやつです。

 
少なくとも700pxくらい(?)は欲しいところなんですが、足りない場合はcssを修正して広げてください。

 
その方法は、ゴメンなさい・・・ググッてね♪ m(_ _;)m

 
ではでは、とっとと作業に取りかかりましょう!!

 

「single.php」にコードを設置する

 
まずはアドセンスコードを3種類用意しておきます。

 
スマホ表示用の「300×250レクタングル」1つ、
PC表示用の「336×280レクタングル(大)」2つ、

 
って感じですね。

 
それぞれ別々のコードを取得するのは、クリック率のデータを取る際に便利だからです。

 
次に、「外観」→「テーマの編集」から、「単一記事の投稿(single.php)」をクリックして選択。

 
中央よりやや上くらいに下記のような記述を見つけてください。

 

</section>
<footer class=”post-footer”>
<?php bzb_social_buttons();?>

 
これの「すぐ上」に、以下のコードにアドセンスコードを追加したものをコピペしてください。

 

 
コピペしたら忘れずに「ファイルを更新」をクリックして保存してくださいね。

 
次に、このままではアドセンス広告が縦に並んで表示されちゃうので、cssに追記することで指示を出すようにします。

 
「スタイルシート(style.css)」をクリックして選択し、最下部に、以下のコードをコピペしてください。

 

 
「ファイルを更新」をクリックして保存すれば、完了です♪

 
さっそくサイトを表示させて、どれか記事を選んで確認してみましょう。

 
で、これがおいらにもよく分からないんですが、もし、アドセンス広告が縦に並んで表示されていたら、記事ページの頭に戻って、パソコンのキーボードの「F5」をクリックしてみてください。

 
再びアドセンス広告の表示部分にまでスクロールしていくと、横並びに表示されるようになっていませんか?
おいらの場合、「ダメじゃん!」って思ったけど、これをやったら成功したんですよね・・・

 
ヽ( ̄▽ ̄;)ノ

 
参考にさせて頂いたサイトには、

 

これで一度保存して、サイトを表示させ、「F5」を押してリロードさせて確認

 
と書かれているんですが、表示させた状態で、キーボードの「F5」キーを押すと、ページが更新されて反映されるってことです♪

 
参考: http://affiliate150.com/side-by-side

 
これで上手くいくと思いますんで、一発でダメでも、2度くらい試してみてくださいませ。

 
あ、PC画面が上手くいったら、念のためスマホでも表示を確認してくださいね。

 
ちゃんと「300×250レクタングル」が1つだけ表示されているはずです♪

新規ブログ「UBL」立ち上げのお知らせ♪

現在、アドセンスブログの手法に特化したサイトを構築中です。

 

その名も・・・♪

 

「UBL(Unchained Business Laboratory)」

 

そもそも英語として成り立っているのかも分かりませんが、

「誰からも束縛されずに稼いで暮らしたい!」

そんな思いを込めたタイトルであります。

 

まだまだ試行錯誤しながら作業している状態ですが、

初心者の方でも取り組みやすいように、たくさんの情報を整理していくつもりです。

 

そんなわけで、まだ中途半端な状態ですが、ひやかしに覗いてやってくださいませ♪

 

わたぼんNEWブログ「UBL」をチェック!