「wp_is_mobile」パソコン・スマホで表示されるWEBページを切り替える

wpismobile-switch-min

wpismobile-switch-min

WordPressをカスタマイズするときによく使うタグが「wp_is_mobile」です。このタグを使えばパソコンでWEBページを見たときの表示と、スマホでWEBページを見たときの表示を使い分けすることができます。

例えば、このようなときに使えるという便利なタグです。

  • 「パソコンとスマホで広告の種類を切り替えたい」
  • 「パソコンだけに表示したいパーツがある」
  • 「スマホだけに表示したいパーツがある」
目次

コードを記述

書き方は簡単、以下のコードを表示させたい場所に追記するだけです。たったこれだけで表示切り替えが可能なんです。

<?php if ( wp_is_mobile() ) : ?>
スマホ・タブレットで表示したい内容
<?php else: ?>
パソコンで表示したい内容
<?php endif; ?>

このようにとっても簡単ですが、1つ気を付けたいことがあります。

スマホとタブレット端末の表示は一緒の扱いです。スマホとタブレット端末、iPhoneやKindle端末と分ける方法はあるにはあるようですが、その場合他にコードを追記する必要があります。

以下は「パソコンだけで表示したい」、「スマホ・タブレットだけで表示したい」場合のコードです。

<?php if ( wp_is_mobile() ) : ?>
パソコンだけで表示したい内容
<?php endif; ?>
<?php if ( wp_is_mobile() ) : ?>
スマホ・タブレットだけで表示したい内容
<?php else: ?>

まとめ

このコードはよく使うので、自分の備忘録として記事にしてみました。便利で簡単なおすすめカスタマイズ・コードです。

[ad2]

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

ジョン齊藤のアバター ジョン齊藤 ブログ運営者 / 執筆者

ブログ歴7年 / 10万PV達成 / ブログの戦闘力を高める・Webマーケティング / 使用テーマSWELL

コメント

コメントする

目次
閉じる