WordPressのアドセンスの広告サイズをパソコンとスマートフォンで変更する方法

ちわーす。
今日は中秋の名月らしいですよ、かっぱふぅ@kappafoo )です。

さて、みなさんのところは台風はどうでしたか?
うちは雨は降りましたが、そこまで風が強くなることもなく問題なしです。

さて、昨日の「固定幅+リキッドレイアウト」に引き続いて、予告したとおりパソコンとスマートフォンでグーグルアドセンスの広告サイズを変える方法を記事にしてみたいと思います。

名付けて「スマホで変更、アドセンス広告サイズ」...ん、そのまんまですね、名付けるほどもなかったかも...

レスポンシブデザインのテーマにして困ることの1つは、テンプレートが1つであることから広告のサイズが1つだと、パソコンとスマホの画面の大きさの違いから、パソコンに合わせるとスマホで全部が表示できない、そうかと言って、スマホに合わせるとパソコンでは表示ザイズが非常に小さいということになってしまいます。

これを防ぐために、一昨日の半日調べました。そうしたら「みはら.com」さんの「レスポンシブデザインのWordPressでAdSenseを切り替える方法」がドンピシャリでした。

[み]レスポンシブデザインのWordPressでAdSenseを切り替える方法 | みはら.com
せっかくスマートフォン対応のためにレスポンシブデザインを採用したのであれば、このAdSenseもきっちりと収めたいっていうのがスジじゃないでしょうか?ということで、スマートフォンなどで表示されたときに、ちょっと小さいAdSenseを表示するようにコードを書き換えましょう。

概要は「みはら.com」さんのページに任せるとして、端的に書いてしまうと、

まず、「functions.php」に次のコードを追加します。

「functions.php」にコードを追加したら、AdSenseを表示したいところに次のコードを追加します。

これで、スマホとパソコンでアドセンスを変えることができます。
もちろん、スマホ時は表示しないということも可です。

このやり方を発見するまでは、CSSの「display: none」で非表示にしようかと考えてました。
それだと、ちょっと大変ですもんね。

とりあえず、昨日の「固定幅+リキッドレイアウト」と併せて、レスポンシブデザインについては50%くらい満足してます。

テーマについては、あとはデザインの美的センスですもんね。

また時間ができたら、考えようと思います。

この記事が参考になったら、シェアしてください

 

 

関連記事も見てください

レスポンシブデザインでGoogleAdsenseの広告サイズ変更が公式サイトで紹介されています。 (2013.06.27)
テーマ1スマートフォン用のWordPressのテーマはどうしよう? (2012.08.27)
responsiveレスポンシブデザインを固定幅+リキッドレイアウトに一歩前進させました。 (2012.09.29)
テーマ2レスポンシブデザインでWordPressのテーマを作製しました。 (2012.09.06)
sidecarWordPressでサイドバーのウィジェットを使用しないようにカスタマイズしました。 (2012.10.13)

RSSの登録で最新記事をお届けします

フォローしてもらえると嬉しいです

F

コメントをどうぞ

メールアドレス (必須・公開されません)
コメント本文

  • スパム・迷惑コメント投稿防止のため、メールアドレスの入力が必須ですが、公開はされません。何卒ご協力のほどお願いいたします。
  • 投稿いただいたコメントは管理者のチェック後掲載しておりますので、即時には反映されません。

▲Pagetop