はじめに
これまで長い間、
さらには、
スマートフォン向けサイトの構築
MODxのmobiledetectionというプラグインを使用すれば、
おさらいになるかもしれませんが、
- ページがロードされた場合に
- リソースがセーブされた場合に
のようなアクションをトリガーとして動作します。たとえば
mobiledetectionプラグインの
この際、
まずはテスト!
いつものように、
まずは、
タイトル | mobiletest |
---|---|
エイリアス | mobiletest |
テンプレート | 無し |
内容 | こんにちは。 <mobile>モバイルからの接続ですね。</mobile> <standard>PCからの接続ですね。</standard> |
見慣れないタグが出てきましたが、
- こんにちは。モバイルからの接続ですね。
と表示され、
- こんにちは。PCからの接続ですね。
と表示されます。実用的な使い方としては、
<html>
<head>
<title>[[*pagetitle]]</title>
<meta name=description content="[[*description]]" />
<mobile> ↓スマートフォンの場合は、このCSSが使用される
<link type="text/css" rel="stylesheet" href="mobile.css" />
</mobile>
<standard> ↓通常ブラウザであれば、これらのCSSやJSが使用される
<link type="text/css" rel="stylesheet" href="standard_one.css" />
<link type="text/css" rel="stylesheet" href="standard_two.css" />
<script type="text/javascript" src="menu.js"></script>
</standard>
</head>
<mobile>
<body class="narrow"> ←スマートフォンの場合は、この行が表示される
</mobile>
<standard>
<body class="huge"> ←通常ブラウザであれば、この行が表示される
</standard>
[[*content]]
</body>
</html>
クライアントの判別方法
閲覧者が通常のブラウザからアクセスしているのか、
これに関しては古くからさまざまな議論があり、
スマートフォン用コンテンツを作成する場合には、
「(メジャーな)
といった心配が出てくるかもしれませんので、
//Detect iPhone
} else if (($uagent_obj->DetectTierIphone() == $uagent_obj->true) && ($iphone == 1)){
delete_template_nodes($standard_node, $mobile_node);
store_user_prefs($mobile_node, $usecookie);
//Detect iPad
} else if (($uagent_obj->DetectIpad() == $uagent_obj->true) && ($ipad == 1)){
delete_template_nodes($standard_node, $mobile_node);
store_user_prefs($mobile_node, $usecookie);
のようにして行っているようです。この、 DetectTierIphoneというメソッドを検索してみたところ、
//Initialize some initial smartphone string variables.
var $engineWebKit = 'webkit';
var $deviceIphone = 'iphone';
var $deviceIpod = 'ipod';
var $deviceIpad = 'ipad';
var $deviceMacPpc = 'macintosh'; //Used for disambiguation
var $deviceAndroid = 'android';
var $deviceGoogleTV = 'googletv';
var $deviceXoom = 'xoom'; //Motorola Xoom
var $deviceNuvifone = 'nuvifone'; //Garmin Nuvifone
var $deviceSymbian = 'symbian';
var $deviceS60 = 'series60';
var $deviceS70 = 'series70';
var $deviceS80 = 'series80';
var $deviceS90 = 'series90';
var $deviceWinPhone7 = 'windows phone os 7';
var $deviceWinMob = 'windows ce';
var $deviceWindows = 'windows';
var $deviceIeMob = 'iemobile';
var $devicePpc = 'ppc'; //Stands for PocketPC
var $enginePie = 'wm5 pie'; //An old Windows Mobile
var $deviceBB = 'blackberry';
var $vndRIM = 'vnd.rim'; //Detectable when BB devices emulate IE or Firefox
var $deviceBBStorm = 'blackberry95'; //Storm 1 and 2
var $deviceBBBold = 'blackberry97'; //Bold
var $deviceBBTour = 'blackberry96'; //Tour
var $deviceBBCurve = 'blackberry89'; //Curve2
var $deviceBBTorch = 'blackberry 98'; //Torch
var $deviceBBPlaybook = 'playbook'; //PlayBook tablet
var $devicePalm = 'palm';
var $deviceWebOS = 'webos'; //For Palm's new WebOS devices
var $engineBlazer = 'blazer'; //Old Palm browser
var $engineXiino = 'xiino'; //Another old Palm
var $deviceKindle = 'kindle'; //Amazon Kindle, eInk one.
//Initialize variables for mobile-specific content.
var $vndwap = 'vnd.wap';
var $wml = 'wml';
-- 略 --
これを見ると、
最後に
中途半端な形での紹介になってしまいましたが、