メイン上部広告の仕様変更とカスタマイズ方法
2014年9月8日にアップデート（ver.1.0.1）を行いました。
今回の変更点は、メインコンテンツ上部に表示される広告枠の仕様です。
メイン上部広告をスマホで出力しないよう変更
上部の広告は基本的に固定ページ以外で出力するようになっています。コードを記述してあるのは、下記のファイル。
- home.php
- index.php
- archive.php
- single.php
ver.1.0.0 ではスマホ・タブレット・PCのすべてで広告が表示される仕様でしたが、スマホのみ出力しないよう変更しました。
仕様変更の理由
この部分はウィジェットから設定でき、レスポンシブデザイン用のアドセンスを使うことを想定しています。
スマホでは 320*50 の広告になるよう調整していましたが、「ファーストビューに広告を置きたくない」「スマホでは広告を減らしたい」というご要望をいただき変更しました。
また、デフォルトの設定ではiPhoneで閲覧したさいに画面から広告がはみ出てしまうため、ver.1.0.0 を利用される場合は調整をお願いします。
出力を制御している部分
該当箇所は下記の部分です。
|
1 2 3 4 5 6 |
<!-- メイン上部 728*90 スマホ非表示--> <?php if(is_mobile()) { ?> <?php } else { ?> <?php dynamic_sidebar( 'main-top' ); ?> <?php } ?> <!-- //メイン上部 728*90 --> |
functions.php に記述している「is_mobile」で分岐しています。
管理画面のウィジェットで該当しているのはここです。
スマホで出力したい場合
前バージョンと同じくスマホでも広告を表示したい場合、該当箇所を下記のように変更してください。
|
1 |
<?php dynamic_sidebar( 'main-top' ); ?> |
また、CSSにも変更点があり、320*50 のサイズを 234*60 にしていますので、分岐タグを外した場合はハーフバナーが表示されます。
|
1 2 3 4 5 6 7 |
/* メイン上部 */ .entrybodytop_ad { width: 234px; height: 60px; margin: 0 auto 24px; overflow: hidden; } |
サイズは任意の値に変更してください。
ただし、モバイルビッグバナー（320*50）にする場合は、iPhone などの画面領域が横幅 320px 表示になっているスマホに対応させるために、左右のマージン値も調整する必要があります。
こちらはカスタマイズサンプルです。
|
1 2 3 4 5 6 7 |
/* メイン上部 */ .entrybodytop_ad { width: 320px; height: 50px; margin: 0 -8px 24px; overflow: hidden; } |
今後のアップデート予定
おかげさまで多くの要望をいただいておりますので、少しずつ改良していきます。現在のところ、下記のアップデートを予定しております。
- role 属性の付与
- スマホ閲覧時のPC表示切替
その他ご要望・不具合等ありましたら、お問い合わせフォームよりご連絡ください。
また、「こんな風にカスタマイズしました！」というご報告をいただければ、当サイトでご紹介いたします。
2013年10月より、おもにWordPress初心者を対象とした指南書がメインのNaifixを開設。2014年3月にカスタマイズ前提のWPテーマ「Gush」を公開。
[…] 参考：メイン上部広告の仕様変更とカスタマイズ方法 […]