WordPressに標準で備わっている wp_is_mobile()で条件分岐を作ってPCとモバイル向けの出力を変える

Wordpress
このエントリーをはてなブックマークに追加
PR

昨今はPC以外のデバイスの普及が爆速で進んでいるのですが、特にスマートフォン向けの最適なWEBサイトの表示が求められています。対応する方法としてはレスポンシブなデザイン、ユーザーエージェントを元に専用ページへのリダイレクトで行ったりするわけですが

WordPressにはwp_is_mobile()という条件指定が出来ます、これを使うことでデバイスごとに出力するものしないものを操作することが出来ます。

 

WordPress で PCとスマートフォン向けの表示の条件分岐

<?php if(wp_is_mobile()): ?>

モバイル向けの内容

<?php else: ?>

PC向け(モバイル以外向け)の内容

<?php endif; ?>

このようにすればモバイル向け、とPC向けでの出力する内容を変えることが出来ます

 

モバイル向けには、できるだけ情報量を絞ってやる必要があるので、この条件分岐を使うと便利です。またデザイン自体もシンプルなものにするならば、CSSも最適な違うものを読み込ませて、転送量を抑えるというのも有りです

 

注意点は キャッシュ

キャッシュ系プラグインを使っていると、最初にアクセスしたどちらかのデバイス向けの静的なHTMLが作成されてそれを以降はキャッシュされたもが表示するようになるので、キャッシュを使っていると最初にアクセスしたデバイス向けの表示に固定されてしまいます

キャッシュを使っている場合は要注意です。

 

あと、wp_is_mobileはタブレットも含まれます、タブレット向けにはPC用の表示をしたいという場合はkの方法は使えません。

PR

COMMENT

コメントを残す

PR

9ineBBの管理人が運営するサイト

WDG WEB DESIGN GALLERY ウェブデザインギャラリー CC0 PHOTO 無料で使える高画質な写真をダウンロード、クレジット表記、リンク不要

9ineBBの最新情報をチェック・購読

Twitter Facebook Google+ Feedly RSS

どこをクリックしてもこの表示を消せます
(3日後以降に再度表示されます)