節約ママの生活を豊かにするヒント

読者です 読者をやめる 読者になる 読者になる

節約ママの暮らしを豊かにするヒント

1歳の娘を育てながらOLとして働くワーキングマザー。育児・ブログ運営・格安SIM(MVNO)・節約の話題多し。無理せず節約しながら、毎日を豊かに暮らすためのヒントを発信します。

無料版はてなブログのレスポンシブデザインでGoogleAdesnseを貼るときに参考になるリンクまとめ!

無料版はてなブログへのアドセンスの貼り方について。スマホとPCで広告の表示を切り替える方法と貼る位置についての記事です。2016年にはてなの仕様変更でレスポンシブデザインにしてもスマホでは広告が3つになってしまいました。なんとかPCだけアドセンスを貼り付ける方法を探しまくったのでリンクをまとめておきます。

Google!

 無料版はてなブログ×レスポンシブデザイン×アドセンスの正解

 

f:id:Sachit:20160709143649j:plain

結論から書くと、

・PCの記事ページに最大2つアドセンスを貼り付けることができる。

・レスポンシブデザインで普通に2つアドセンスを貼っているままだと仕様変更のため、スマホは広告が多すぎて規約違反になる可能性あり。

スマホは無理なのでアドセンスはあきらめる。

です!

 

無料版でもレスポンシブにすることでアドセンス貼り付け可能(だった)

 

 こちらのブログにも書かれている通り、以前は、はてなブログ無料版のアドセンス広告が配置できました。通常広告がPC1つ、スマホ3つになっているのですが、レスポンシブデザイン(PCとスマホで同じデザインを表示させること)にすることで、スマホの広告表示がPCと同じ1つになるので、記事ページに2つアドセンス貼れたんです。

アドセンスは3つまで2016年規約が改定されて1ページ当たりのアドセンス数の上限は撤廃されました。ただし、広告だらけになるのはGoogleさん的にはNG。

gattolibero.hatenablog.com

 

 

記事下シェアボタン前にアドセンスを入れることができるという話も載っています。

gattolibero.hatenablog.com

 

 

 アドセンスの貼り方について、こちらのブログも興味深く読ませてもらいました。

kumoaozora.hatenablog.com

 

突然の仕様変更!

 

f:id:Sachit:20160710105344j:plain

レスポンシブにして、記事下に貼ればいいのねと思ったら最近仕様が変更されていて、そんな簡単な話ではないようです。

レスポンシブデザインでも、スマホでははてなが出している広告が3つ(以上)表示されるようになってしまいました。Googleadsenseはアドセンス広告が3つを超えて表示されるとまずいらしいです。はてなの広告はアドセンスとそれ以外の広告とランダムに出しているみたいですが、はてなの広告が全部アドセンスだったら自分のアドセンスを貼った時点で規約違反になっちゃいます。

staff.hatenablog.com

 

でもレスポンシブデザインは変えたくない

 

f:id:Sachit:20160709144112j:plain

じゃあレスポンシブデザインやめてPCだけにアドセンス貼れば良いじゃん、となると思います。もしくはProにしちゃうか。(はてなはさんはそれを狙ってるんでしょうか?)ただ、もうすでにいろいろカスタマイズしちゃってるわけです。いろいろCSSを変えすぎていて、今からPCだけにデザインテンプレートを適用していい感じにカスタマイズを修正できる自信がありません。スマホのデザインが変えられないのもさみしいし。

 

やりたいこと

 

PCでは記事下(シェアボタン前)に横に並べて2つアドセンス表示させる。

スマホでは非表示もしくは楽天Amazonのモーションウィジェットを入れる(モーションウィジェットは入れるとページの読み込み時間が長くなると書かれていたのでちょっと迷ってます)

 

 参考にしたリンクまとめ

f:id:Sachit:20160710110640j:plain

 参考にしたリンクをまとめておきます。

こちらのブログではスマホで非表示にする方法が書かれています。(画面の幅で見ているらしい)

 

gssmboy.hatenablog.jp

  

さらに同じ方ですが、PCとスマホで別の広告を表示させる方法を書かれています。

gssmboy.hatenablog.jp

 

こちらの方も書かれています。非表示・切り替えどちらもできるようです。

thetheorier.hatenablog.com

 

このリンクもやってみましたが、WordPressだけみたい。

wp_is_mobile()でAdSenseの表示を制御する | 初心者にもおすすめ!無料 WordPress テーマ Principle

 

表示サイズと配置を変える方法について書かれています。

www.toritemi.com

 

 

まとめ

google_logo

無料はてなブログのレスポンシブデザインでアドセンス広告を貼ると、スマホが広告だらけになってGoogleアドセンス規約違反になってしまう可能性があるので要注意です。PCのみでアドセンスを表示させて、スマホで非表示にすることができるのであれば、アドセンスは貼り付けできそうです。今回ご紹介した記事を参考にしたらなんとかできそうかと。

このあたりのリンクをいろいろためしてみて、なんとかPCのみでアドセンスを貼ることに成功しました。長いので次回の記事で詳しめに書く予定です。