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

ほぼ日刊双極性日記

双極性障害持ちの日常を中心に。最近ミニマリスト目指し始めました。

はてなブログProにしたので、とりあえずGoogleAdSenseを貼ってみた

 先日の日記で迷っていましたが、今日はてなブログProにアップグレードしました!とりあえず1ヶ月の期間限定ですが、色々試してみたいと思います。

 

 先日の日記でも書いたのですが、要はGoogleAdSenseを本格的に試してみたいというのがアップグレードの目的でしたので、早速アドセンスの広告を貼ってみました。

 

 まずは、設定→詳細設定に行き、GoogleAdSense広告を表示しないにチェックを入れます。これから広告貼るのに表示しないにチェック入れるのかよと思われる方もいるかもしれませんが、これははてなブログ側が貼っている広告を貼らないという意味です。これをしないと、これから自分の貼る広告とはてなブログの貼っている広告が混在し、1画面に3つまでというGoogleAdSense広告のルールに抵触してしまいます。

 

 これをやってから、広告を貼っていきましょう。まずはPCで表示される広告を貼っていきます。GoogleAdSenseの管理画面で広告コードを取得したら、デザイン→カスタマイズに行き、

  • ヘッダ→タイトル下(1つめ)
  • サイドバー→モジュールを追加→HTML(2つめ)
  • 記事→記事上下のカスタマイズ→記事下(3つめ)

に広告コードをコピペして貼っていきます。ちなみに自分が選んだ広告のサイズはタイトル下がビッグバナー(728×90)、サイドバーがレンタングル(300×250)、記事下がレンタングル大(336×280)です。

 

 広告の位置とか大きさとかどれが正解というのは無いようですが、こちらのGoogle公式のサポートページの記載が参考になるかと思います。

support.google.com

 

 さて、これで終わりではありません。今度はスマホで表示される広告を貼っていきます。今や、PCで見る人よりスマホで見る人の方が多いと言われています。ここも忘れずに行きましょう。GoogleAdSenseの管理画面で広告コードを取得したら、デザイン→スマートフォンに行き、

  • ヘッダ→タイトル下スマートフォン用にHTMLを設定するにチェック)(1つめ)
  • フッタ→ページャ下(2つめ)
  • フッタ→フッタスマートフォン用にHTMLを設定するにチェック)(3つめ)

に広告コードを貼っていきます。自分が選んだ広告サイズは、タイトル下がラージモバイルバナー(320×100)、ページャ下がレスポンシブ(サイズ可変)、フッタがラージモバイルバナー(320×100)です。

 

 因みにスマホの広告でタイトル下にレンタングルサイズの広告を貼ると、スクロールしなければコンテンツが見えなくなるように広告を貼るのは禁止というGoogleAdSenseの規約に反してしまうようです。詳しくはこちら。

support.google.com

 

 

 ここまでで、一応GoogleAdSenseの広告貼りはお終いですが、このままだとちょっとだけ困ったことが起きてます。それは、はてなブログのスマホでの表示は300ピクセルなのに対して、先ほど貼ったスマホ用のラージモバイルバナーの横幅は320ピクセルとちょっと大きいんですよね。これをそのまま放置するとスマホで見ると横にガタガタ動く感じになってしまいます。

 

 それを解消するには、ちょっとした一手間が必要になります。それがこちら。こちらの記事を参考にというか、そのまま真似させていただきました。ありがとうございます。

 

akiueo.hatenablog.com

 

 

  これでGoogleAdSenseのとりあえずの設定は終わりです。後は記事をガンガン書いてPVを増やしていきたいですね。それでは。

 

【かかった時間:約2時間】