ジユウメモメモ

当サイトは通販サイト・外部Webサービスへのリンクの一部にアフィリエイト広告を使用しています

WordPressのテーマをスマホ対応させるのに便利な関数「wp_is_mobile」

display:none;はなるべく使いたくない・・・。

 WordPressのテーマをモバイル対応に書き換えていて、PCのブラウザ表示、iPhoneのモバイルSafariで見た時の表示/非表示の指定をCSSのクラスで(”hidden_pc”、”hidden_sp”のようなクラス名)行っていたのだけど、AdSenseの規約の中に”スタイルシートで非表示にすること”が禁止されている。このままでは抵触するするのでは・・・?というわけでその他のやり方を探していたら便利な関数があった。

「wp_is_mobile」という関数を使うと、スマートフォンとそれ以外のデバイス(PC)のアクセスに見せるコンテンツを別々に指定することができるようになる。

WordPress Codex:wp_is_mobile

iPhone・Androidスマートフォン/PCで表示させるコンテンツを指定する

PCブラウザのときに表示して、iPhoneやAndroidのスマホからのときに非表示にしたいとき、またその逆の指定をしたいときは次のように記述する。

<?php if (wp_is_mobile()) :?>
//ここにiPhone・Androidスマートフォン(PC以外のデバイス)からアクセスされたときに見せたいコンテンツを記述する
<?php else: ?>
//ここにPCからアクセスされたときに見せたいコンテンツを記述する
<?php endif; ?>

「wp_is_mobile」関数を使うことで、デバイスによってAdsenseの異なるサイズのバナーを表示したり、ブログの検索窓の表示位置を変えたりできるようになる。サイドバーに置くテキストウィジェットに使えば、レスポンシブレイアウトで見せるウィジェット、見せないウィジェットを選択することも可能になる(この使い方をするときは見出しを空欄にしてコンテンツ欄に見出しタグを使う)。PHPに詳しくなくてもこの関数を知っておくと簡単に実装できて便利。レスポンシブレイアウトのWordPressテーマを作るときに大活躍するはず。