Home

Detecting Mobile Browsers to Re-Theme Your Site

Attached Files


UserAgentInfo.zip(4.1 KB)

With the proliferation of Smart Phones and other non-traditional-computer ways to browse the internet, wouldn’t it be great if you could provide a custom browsing experience for different users?

You could re-template your site using the sub-sites module, but it might not be stable/functional enough for every one yet. So I’ll show you how to use Anthony Hand’s great User Agent Detection Class to re-template your site based on the User Agent of your visitor.

First things first get yourself a copy of the Class from the link above. He also has a lot of great resources on designing for mobile browsers.

Before we can actually use the calls we need to make some modification. Because of the way SilverStripe’s Manifest builder handles filenames and class names we need to change name of the file, remove the underscores from the name of the class. To sum up:
mdetect_php.txt becomes uagentinfo.php
and in the actual file (line 53):
class uagent_info becomes class uagentinfo

You now add this file to your mysite/code directory and do a dev/build.

Now that SilverStripe knows about the Class we need to call it from the init() function in your mysite/code/page.php

Lets Step through This

In the first part of the code we set variables for the themes we want to use for the three main tiers of mobile browser: iPhone, BlackBerry and Plain old WAP. Right now we’re just using tutorial but you can set these to whatever your want.

n this part we check to see if the mobilePhone session variable is already set, and if it is we use a switch function to use this variable to set the theme with the SSViewer::set_theme() function, dropping in the corresponding theme name variable in each case. If the session variable isn’t set we move on to actually detecting the user agent.

Here we create a new instance of the uagentinfo class and save it to $uagentobj. we then Take that object and run the first class detection on it, iphone. If the browser is an iPhone its saves that value to the $_SESSION[‘mobilePhone’] variable. If not it runs the next tier detection and so on.

This is great, but what if someone is using an iPhone or other similar device whose browser can support a non-mobile site with all the bells and whistles. We need to provide the user with a way to override the detection.

In you page_controller add the following function:

This function provides us a way to manually set the $_SESSION[‘mobilePhone’] variable to “None” so that the first CHECK function won’t move on to detecting the user agent. It then forces the browser to reload the current page. All we have to do is add the following to mobile phone templates:

Thats it, now all you have to do design you mobile templates and you have functioning mobile version of your site. The class is great as it contains methods for detecting many more user agent types including video game platforms and other hand held devices. You could also expand this to use sub-domains to set the $_SESSION[‘mobilePhone’] variable.

Enjoy

About the Author

Name: Richard Rudy

Comments (10)

  • locking them out of the standard page class, then readmitting them on the sub class but it seems 22 vf

    Posted by chanel purses, 29/09/2010 4:08am (4 years ago)

  • I wish you have a wonderful day!
    jiemo

    Posted by Louis Vuitton, 28/09/2010 4:52am (4 years ago)

  • I wish you have a wonderful day!
    jiemo

    Posted by Gucci, 28/09/2010 4:51am (4 years ago)

  • I wish you have a wonderful day!
    jiemo

    Posted by Chanel, 28/09/2010 4:51am (4 years ago)

  • I wish you have a wonderful day!
    jiemo

    Posted by nike, 28/09/2010 4:50am (4 years ago)

  • http://http://www.findsoso.com/

    Our website wholesale for many kinds of fashion clothing, such
    as nike,jordan,prama,****, we also sell jeans,shirts,bags,hat and
    many kinds of tiffany. All the products are free shipping, and the
    the price is enticement , and also can accept the paypal
    payment.we can ship within 24 hours after your payment.

    accept the paypal

    free shipping

    competitive price

    any size available



    Everything is here http://www.findsoso.com friends, please
    enjoy viewing bar

    Thanks

    Posted by xihuan, 27/09/2010 10:31am (4 years ago)

  • march

    Posted by coach outlet, 16/09/2010 2:20am (4 years ago)

  • march

    Posted by coach outlet, 16/09/2010 2:12am (4 years ago)

  • march

    Posted by coach outlet, 16/09/2010 2:11am (4 years ago)

  • march

    Posted by coach outlet, 16/09/2010 2:07am (4 years ago)

1 2 3 next »

RSS feed for comments on this page RSS feed for all comments

Post your comment

Comments have been disabled. Please visit this post on SSBits.com to post your comment