【wordpress】PC(タブレット)とスマートフォンで記事内の表示内容を切り替えるショートコードの設定方法 第06回 16年04月 / 最終更新：2016.04.06
目次
wordpressでは記事内で php を使えないため、ショートコードでPCとスマートフォンの表示/非表示を切り替えられるようにしておくととても便利です。
上記の記事は、PCとスマートフォン（iPadなどタブレットはスマートフォンに含む）で表示内容を切り替える方法でしたが、今回はタブレットはPC表示に含む場合の設定方法です。
『wp_is_mobile』関数について
『wp_is_mobile』関数は、Webサイトを閲覧するデバイスのヘッダー情報を見て、PC用のコンテンツと、スマートフォン用のコンテンツを切り分ける、WordPressで予め用意されている条件分岐タグです。
この関数はPCと、スマートフォン（タブレットを含む）を分岐するため、タブレットをPCに含みたい場合は調整が必要です。
記述方法
PC／SPを分岐する『wp_is_mobile』関数を使い、更にサーバー変数でユーザーエージェントを取得して複数分岐します。
今回はiPadで条件分岐した場合の記述例です。
以下の通り、functions.php に記述します。
1. //PCでのみ表示するコンテンツ
2. function if_is_pc($atts, $content=null)
3. {
4. $content= do_shortcode( $content);
5. $ua= $_SERVER['HTTP_USER_AGENT'];
6. if( strpos($ua,'iPad')!==false){
7. return $content;
8. }elseif(!wp_is_mobile())
9. {
10. return $content;
11. }
12.}
13.add_shortcode('pc','if_is_pc');
14.//スマートフォン・タブレットでのみ表示するコンテンツ
15.function if_is_nopc($atts, $content=null)
16.{
17.$content= do_shortcode( $content);
18.$ua=$_SERVER['HTTP_USER_AGENT'];
19. if(wp_is_mobile())
20. {
21. if(strpos($ua,'iPad')!==false){
22. returnfalse;
23. }else{
24. return$content;
25. }
26. }
27.}
28.add_shortcode('nopc','if_is_nopc');
上記コードの説明
PC（iPad）表示の記述は、
任意の変数($ua)の中に、サーバー変数で取得してきたユーザーエージェントの値を入れ、strpos関数で指定した文字列が含まれるかどうかチェックします。
今回の場合、その値の中に「iPad」値があったら $contents を返してコンテンツを表示させます。
SP表示の場合はその逆で、
値の中に「iPad」値があったら false を返して if_is_nopc 関数を終了させ条件から除外、それ以外には $content を返してコンテンツを表示させています。
今回はiPadで切り替えましたが、同様に特定のデバイスのユーザーエージェントを指定して条件分岐することが可能です。
実際に記事内で使うショートコード
投稿、または固定ページ内で、下記ショートコードを使います。
＊pc（タブレット）で表示させたいコンテンツ
［pc］hoge［/pc］
＊スマートフォンで表示させたいコンテンツ
［nopc］piyo［/nopc］
※↑［］を半角になおしてくださいね！
サービス・ソリューション
