[Printable]
Share

How to Make a mobile version of a website

Posted: Sat 20th June 2009 in Blog

I've been working on a mobile version of this website, much of it was remakably simple.

Step One Wheat from Chaff.

Firstly we need to detect mobile browsers, now all browsers Idetify themsleves to the website, and the web is a wash with huge lists of the various strings. in the end rather than writing huge lumps of rubish to identify them all I used this php script: http://detectmobilebrowsers.mobi/. This is pretty handy and a bit of Javascript on their website generates the settings for you. Now I've decided to use the same names for all the files in my mobile website, so when its done it will forward the landing page to the mobile eqivalent by getting the caller URL from PHP's server variables.

Step Two Rewriting.

Notes:
all the re-rwites in this section and
the size does matter section assume
ou've a var called "$html" which it updates

This page is pretty symplistic, its just got a couple of images. In it. All my site like most blogs is a MySQL database full of chunks of HTML. Problem all the paths to photos etc need re- writing for the actuall posts. Really sumple use preg_replace to solve it. All my ilustrations etc are in a directory called "content" so the paths are allways content/something. Just replace contentslash with slashcontentslash.

$html=preg_replace("/content\//i", "/content/", $html); //rewrite paths

I've also go various bits of flash and video's embeded in my HTML posts. Hmm don't really want them in a mobile browser, this is a bit harder, strip_tags() the pattern matching was behind me so I "borrowed" the following code from the commnets section of the PHP srip_tags() manual page:

$html=preg_replace("/

[Printable]
Share

How to Make a mobile version of a website

Posted: Sat 20th June 2009 in Blog

How to Make a mobile version of a website

I've been working on a mobile version of this website, much of it was remakably simple.

Step One Wheat from Chaff.

Firstly we need to detect mobile browsers, now all browsers Idetify themsleves to the website, and the web is a wash with huge lists of the various strings. in the end rather than writing huge lumps of rubish to identify them all I used this php script: http://detectmobilebrowsers.mobi/. This is pretty handy and a bit of Javascript on their website generates the settings for you. Now I've decided to use the same names for all the files in my mobile website, so when its done it will forward the landing page to the mobile eqivalent by getting the caller URL from PHP's server variables.

Step Two Rewriting.

Notes:
all the re-rwites in this section and
the size does matter section assume
ou've a var called "$html" which it updates

This page is pretty symplistic, its just got a couple of images. In it. All my site like most blogs is a MySQL database full of chunks of HTML. Problem all the paths to photos etc need re- writing for the actuall posts. Really sumple use preg_replace to solve it. All my ilustrations etc are in a directory called "content" so the paths are allways content/something. Just replace contentslash with slashcontentslash.

$html=preg_replace("/content\//i", "/content/", $html); //rewrite paths

I've also go various bits of flash and video's embeded in my HTML posts. Hmm don't really want them in a mobile browser, this is a bit harder, strip_tags() the pattern matching was behind me so I "borrowed" the following code from the commnets section of the PHP srip_tags() manual page:

$html=preg_replace("/