WordPressの投稿でページを作成した際に、
「ここはPCのみに表示させたい」
や
「ここはスマートフォンで見た時のみ表示させたい」
などといったことが出てくる時があります。
CSSで表示・非表示をさせることも可能なのですが、その時にはソース自体は存在しているので多少なりともページの表示が遅くなってしまう時があります。
なので、WordPressでサイトを制作している際には、wp_is_mobile()というテンプレートタグを使うことでPCの時に表示させたいもの、スマートフォンの時に表示させたいものをそれぞれ記述しておく…という方法がオススメです！
なので今回はwp_is_mobile()についてまとめておきたいと思います！
wp_is_mobile()とは？
そもそもwp_is_mobile()とはWordPressで使用できるタグで、これを記述することでページを見た際に端末ごとで表示内容を変更させてくれます。
WordPressというのはページ閲覧時に毎回ページを生成するような仕組みになっているので、ページを見た際にwp_is_mobile()が記述されていた場合にはそこは条件分岐して内容の生成をしてくれる…というものになります。
言葉で書いてもうまく説明できない…というのに自分の力量の無さを感じますが(汗)、wp_is_mobile()を使うことで端末ごとに内容の切り替えができる、ということだけ知っておいていただけたら、と思います(^^;)
1. 【スマートフォンの内容の表示とそれ以外の表示】という書き方の場合
wp_is_mobile()の書き方は2つあり、まず
【スマートフォンの内容の表示とそれ以外の表示】
という書き方の場合は以下のように記述することで実装可能です。
<?php if(wp_is_mobile()): ?> スマートフォンで閲覧した時に表示する内容 <?php else: ?> PCで閲覧した時に表示する内容 <?php endif; ?>
このように記述することでソース生成時に端末ごとで生成するソースをわけることができます！
2. 【PCの内容の表示とそれ以外の表示】という書き方の場合
続いて
【PCの内容の表示とそれ以外の表示】
という書き方をしたい場合は以下のように記述しましょう。
<?php if(!wp_is_mobile()): ?> PCで閲覧した時に表示する内容 <?php else: ?> スマートフォンで閲覧した時に表示する内容 <?php endif; ?>
以上のように記述することで実装が可能になります！
まとめ
以上がwp_is_mobile()の記述方法になります。
上にも書いたように書き方には2つあるので、ソースを記述する時にどちらの順序で書いたら自分に合うか考えたうえで決めていただけたらと思います！
