WordPressでは、スマートフォンやタブレットなどのモバイル端末とPCで表示を切り替えたい場面がよくあります。そんなときに便利なのが、WordPressが標準で提供している関数 wp_is_mobile()
です。この関数を使えば、簡単に端末に応じた表示を切り替えることができます。
wp_is_mobileとは
wp_is_mobile()
は、ユーザーが使用している端末がモバイルかどうかを判定する関数です。スマートフォンやタブレットからのアクセスであれば true
を返し、PCなどそれ以外の端末からのアクセスであれば false
を返します。
基本的な使い方
wp_is_mobile()
はテンプレートファイルやウィジェット、ショートコードの中など、さまざまな場所で使用できます。以下は基本的な条件分岐の例です。
if ( wp_is_mobile() ) {
// スマホ表示用の処理
echo '<p>スマートフォン用のコンテンツです。</p>';
} else {
// PC表示用の処理
echo '<p>PC用のコンテンツです。</p>';
}
このコードをテンプレートファイル(例:header.phpやpage.php)に記述することで、端末に応じた表示の切り替えが可能です。
実用的な応用例
例えば、スマートフォンでは電話リンクを表示し、PCでは問い合わせフォームへのリンクを表示したい場合、以下のように記述できます。
if ( wp_is_mobile() ) {
echo '<a href="tel:0123456789">電話する</a>';
} else {
echo '<a href="/contact/">お問い合わせフォームへ</a>';
}
注意点
wp_is_mobile()
はサーバーサイドでの判定であり、JavaScriptやCSSでのレスポンシブ制御とは異なります。そのため、ブラウザのリサイズによる表示切り替えには対応していません。ユーザーエージェントによって判定されるため、意図しない判定結果が出ることもある点に注意が必要です。
まとめ
wp_is_mobile()
を活用すれば、WordPressのテンプレート内で簡単にスマートフォンとPCで表示内容を切り替えることができます。電話番号の表示、画像のサイズ変更、ナビゲーションの出し分けなど、さまざまな場面で活用できるため、ぜひサイトに応じて取り入れてみてください。