・WordPressでPCとスマホ表示を切り替える方法は？
こんな疑問にお答えします。
WordPressにてPCとスマホで表示を切り替えたときありますよね。
実はそれ「wp_is_mobile()」を使えば、簡単に切り替えることができます。
使ってみよう！
ということで、この記事では「WordPressでPCとスマホ表示を切り替える方法」について解説していきます！
・wp_is_mobile()でPCとスマホ表示を切り替え
・「PC／タブレット」or「スマホ」で表示を切り替え
目次
【裏技】wp_is_mobile()でPCとスマホ表示を切り替え【WordPress】
WordPressでPC表示とスマホ表示を切り替える方法は「wp_is_mobile()」を使えばOK。
下記みたいに使います。
<?php if ( wp_is_mobile() ) : ?>
<!-- スマホでの表示内容 -->
<?php else: ?>
<!-- PCでの表示内容 -->
<?php endif; ?>if文を用いて、スマホ表示の内容、PC表示の内容を切り替えることができました。
「wp_is_mobile()」は、WordPressの関数の1つ。
現在のユーザーエージェントがモバイルデバイスかどうかをチェックするために使用されます。
スマホやタブレットからアクセスされているかを判定してくれます。
つまり判定したのち、if文を使えばPCとの内容を切り替えることが可能になるということです。
先述したように「wp_is_mobile()」は、スマホだけでなくタブレットも含んで判定します。
つまり「スマホ／タブレット」or「PC」になるということ。
スマホのみ表示切替をしたい場合は、別の方法を使う必要があります。
【裏技】「PC／タブレット」or「スマホ」で表示を切り替え【WordPress】
「スマホのみ」表示切替をする場合、違う方法を使います。
それがfunctions.phpにて新たに関数を作ること。
それがこちら。
function is_mobile(){
$useragents = array(
'iPhone', // iPhone
'iPod', // iPod touch
'Android.*Mobile', // 1.5+ Android *** Only mobile
'Windows.*Phone', // *** Windows Phone
'dream', // Pre 1.5 Android
'CUPCAKE', // 1.5+ Android
'blackberry9500', // Storm
'blackberry9530', // Storm
'blackberry9520', // Storm v2
'blackberry9550', // Storm v2
'blackberry9800', // Torch
'webOS', // Palm Pre Experimental
'incognito', // Other iPhone browser
'webmate' // Other iPhone browser
);
$pattern = '/'.implode('|', $useragents).'/i';
return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}「is_mobile()」という関数を作り、「PC／タブレット」or「スマホ」で判定するようにできました。
先ほど同様、if文を用いて使用すればOK。
<?php if ( is_mobile() ) : ?>
<!-- スマホでの表示内容 -->
<?php else: ?>
<!-- PCでの表示内容 -->
<?php endif; ?>【裏技】wp_is_mobile()でPCとスマホ表示を切り替え【WordPress】：まとめ
結論：切替の場合によって使い分けようってことですね。
- 「wp_is_mobile()」⇒「PC」or「タブレット／スマホ」
- 「is_mobile」 ⇒「PC／タブレット」or「スマホ」
PCとスマホの表示を切り替えたい場合は使ってみよう！
