iPhone Webpage Version Choice

[corbywan]

I'm sure this is in here somewhere but a search didn't help me.

I'm wondering how I could about making a website switchable between a standard version and an iPhone version. I'm aware of how the agent header works and how to make an iPhone automatically redirect to an iPhone version of a site.

What I'm wondering about is pages like foxnew.com (just an example, not politics please) and how on the iPhone it offers a link at the bottom of the page to the full-size/standard website. It uses a script of some kind because it appends /?noiphone at the end of the standard foxnew.com address.

I think I've seen other sites that do the same, even offering on the main page a link back to the iPhone version. Any resources one can point me to? I'll continue to search on my own. Thanks!

 

[Not Available]

I think it can be achieved by setting media="screen" for the stylesheet of the full version and media="handheld" for the iPhone version. Then use JavaScript/PHP to switch between them in a link at the bottom.

Wordpress, for example, has such a plug-in. You could try downloading it and inspecting its code.

 

[angelwatt]

If you want to detect if they're using an iPhone you can check the user-agent string and look for iphone. This can be checked via PHP or JavaScript so you can handle it server side or client side. Just realize with JavaScript, it will only help those with it enabled. PHP will handle it for all though.

There's a few ways to specifically go about it. I wouldn't rely on using the media="handheld" bit for CSS as it's unfortunately not always followed properly. I use to have a JavaScript stylesheet switcher that would change the layout and color scheme of the page, but I got bored with it.