2011年11月14日月曜日

Modx ユーザーエージェントによる表示切り替え 【表示スニペット】

ブラウザーのユーザーエージェントを使って、表示(内容)を切り替える極簡単なスニペット。

ページ全体の表示を切り替えるのであれば、MobileConverter※1を使用すれば、指定したブラウザー毎に表示変更が可能になりますが、そこまで必要ないと言ったような場合に意外と便利。

ページの極一部の表示がそのブラウザーに対応していないなどの場合、新たにテンプレートを作るよりは効率的?ではないかな。



●iPadなどでFlashを採用している箇所を他のパーツに置き換える。
●IE8以前のブラウザーは、別のCSSを読み込ませる。

など。

基本的に、スニペットなので、テンプレート内のどこに設置しても動作しますし、書き換えの内容もスニペット・チャンクの別を問わないので、使用範囲も幅広いはずです。



サンプル
**************************************************************************

<?php
$agent = $_SERVER['HTTP_USER_AGENT'];
if(ereg("^DoCoMo", $agent)){
■■■;// DoCoMo対応
}else if(ereg("^J-PHONE|^Vodafone|^SoftBank", $agent)){
■■■;// ソフトバンク部類
}else if(ereg("^UP.Browser|^KDDI", $agent)){
■■■;// AU?
}else if(ereg("iPhone", $agent)){
■■■;// iPhone
}else if(ereg("WILLCOM", $agent)){
■■■;// WILLCOM
}else if(ereg("^PDXGW", $agent)){
■■■;// PDXGW
}else if(ereg("DDIPOCKET", $agent)){
■■■;// DDIPOCKET
}else{
■■■;// 上記以外 PC等?
}
?>


**************************************************************************

■■■部に、表示させたい内容を書き出す。
書き出す方法は、echo または、return 文で。

また、ターゲットとするブラウザーが決まっている場合は、こんなにユーザーエージェントを列挙する必要はないので、ターゲットとするブラウザーのみを書けばよいです。


ユーザーエージェントの種類に関しては、下記サイトを参照。
PCブラウザ
http://www.openspc2.org/userAgent/

スマートフォン関連
http://www.kagua.biz/android/ualist.html


※1
MobileConverterはユーザーエージェントで指定したブラウザーに対して、使用できるテンプレートは1種類しか利用できなくなるので、MobileConverterのタイトル通り、モバイル用にした方が無難でしょうかね…


神奈川県を中心として主に横浜・川崎・東京23区西部の中小企業・個人事業主向けホームページを制作しております。 横浜本田WEB


横浜本田WEB Facebookページ
http://www.facebook.com/hondaweb?fref=ts

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


Facebookへ投稿