Redirect iPhone or Android to a Mobile WebSite
I was browsing this website (http://www.bookofzeus.com) on my iPhone the other day and I discover how painful it was to navigate using my mobile device. The next hour, my mobile website was ready but one problem was left to be solved.
How would I redirect traffic from my site to a mobile site with a mobile device?
My first idea was to use Javascript.
//iPhone Version: if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) { window.location = "http://m.bookofzeus.com/"; } //Android Version: if(navigator.userAgent.match(/android/i)) { window.location = "http://m.bookofzeus.com/"; }
But then I was thinking that the page has be loaded in order to execute the JavaScript code. Which I wasn't really a fan of this Idea.
Then I was thinking about PHP. Checking the user agent is easy in PHP and this redirection can be done
// iPhone Version: if(strpos($_SERVER['HTTP_USER_AGENT'],'iPhone') !== FALSE || strpos($_SERVER['HTTP_USER_AGENT'],'iPod') !== FALSE) { header('Location: http://m.bookofzeus.com/'); exit(); } // Android Version: if(strpos($_SERVER['HTTP_USER_AGENT'],'Android') !== FALSE) { header('Location: http://m.bookofzeus.com/'); exit(); }
This works great, but I realize some of my pages are static. In other words, pure HTML generated code. Which this case, PHP won't work.
So I finally went for the .htaccess solution.
RewriteEngine On RewriteCond %{HTTP_USER_AGENT} "iphone|ipod|android" [NC] RewriteCond %{HTTP_HOST} !^m.bookofzeus.com RewriteRule ^(.*)$ http://m.bookofzeus.com/ [L,R=302]
If you need more mobile devices, here's a quick list you can use:
RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC]