Tuesday, July 22, 2003
Mobile Device Re-Direct Code
Posted by Jason Dunn in "DEVELOPER" @ 01:00 PM
Webmasters, listen up: if you'd like to create a version of your site for mobile devices, the first step is to create code that will detect the type of device hitting the site (or, more accurately, its browser). The sniffer code to do so, developed by Fabrizio Fiandanese, looks like this:
[code]<?
if (stristr($ua, "Windows CE") or stristr($ua, "AvantGo") or stristr($ua,
"Mazingo") or stristr($ua, "Mobile") or stristr($ua, "T68") or stristr($ua,
"Syncalot") or stristr($ua, "Blazer") )
{
$DEVICE_TYPE="MOBILE";
}
if (isset($DEVICE_TYPE) and $DEVICE_TYPE=="MOBILE")
{
$location='mobile/index.php';
header ('Location: '.$location);
exit;
}
?>[/code]
You can also use Javascript version that detects any Windows-CE client:
[code]<script>
var isCE = navigator.appVersion.indexOf("Windows CE")>0;
if (isCE)
{
window.location.href="mobile/";
}
</script>[/code]
Place the above at the very top of your index page, and when a mobile device hits it, it will be re-directed to your mobile page. The industry standard is www.domain.com/mobile/index.htm (or .php, .asp, etc.). From there it's a matter of building the appropriate components into your mobile site. At the very least, if you're running a retail business, include contact information, your business hours, etc. If your Web site is dynamic, with your content separated from the templates, you should be able to include your data in a mobile device-friendly format.
It's also a good idea to include a link on your mobile page back to the desktop home page, this time with a version that doesn't have the sniffer code - for those people who are running more capable mobile device browsers, or desperately need something off your site.
[code]<?
if (stristr($ua, "Windows CE") or stristr($ua, "AvantGo") or stristr($ua,
"Mazingo") or stristr($ua, "Mobile") or stristr($ua, "T68") or stristr($ua,
"Syncalot") or stristr($ua, "Blazer") )
{
$DEVICE_TYPE="MOBILE";
}
if (isset($DEVICE_TYPE) and $DEVICE_TYPE=="MOBILE")
{
$location='mobile/index.php';
header ('Location: '.$location);
exit;
}
?>[/code]
You can also use Javascript version that detects any Windows-CE client:
[code]<script>
var isCE = navigator.appVersion.indexOf("Windows CE")>0;
if (isCE)
{
window.location.href="mobile/";
}
</script>[/code]
Place the above at the very top of your index page, and when a mobile device hits it, it will be re-directed to your mobile page. The industry standard is www.domain.com/mobile/index.htm (or .php, .asp, etc.). From there it's a matter of building the appropriate components into your mobile site. At the very least, if you're running a retail business, include contact information, your business hours, etc. If your Web site is dynamic, with your content separated from the templates, you should be able to include your data in a mobile device-friendly format.
It's also a good idea to include a link on your mobile page back to the desktop home page, this time with a version that doesn't have the sniffer code - for those people who are running more capable mobile device browsers, or desperately need something off your site.