Friday, March 26, 2010

Themes for Mobile

Just an 'aha' or a 'well duh' moment (depending on how you look at it), but I realized today that I could set up a theme for 'mobile' friendly display.

So, I create my new mobile theme and adjust the views accordingly.

Then in my index.php I run a check for known mobile browsers against the $_SERVER['HTTP_USER_AGENT'] and if found, I set $config to /protected/config/mobile.php instead of main.php

Primary difference being the theme set, though I imagine I might add a few other differences over time.

9 comments:

  1. How are you going about designing the mobile layout? I'm interesting in doing this too and one thought google found me is iWebKit

    http://iwebkit.net/

    I'm not sure if it works on android though and I don't know if it degrades nicely with the smaller, less smart phones (although I don't think I want to target them anyways.. hmm)

    ReplyDelete
  2. I haven't done much with it to this point, just put together a very pared down stylesheet to render the menus as lists etc. Waiting on our designer to get back to me with his thoughts on how it should look.

    How would you integrate the iWebKit framework? I've only looked at it very briefly, but it sounds like it's own framework and I'd like to end up with one core application with multiple views styles.

    ReplyDelete
  3. Its called a framework but I don't think it's really anything more than a style sheet or two and some images (no php or anything like that). It should be usable with themes I think.

    ReplyDelete
  4. I finally did get around to playing with the iWebKit, and it is pretty easy to use. The only complication is that you really do need to structure the views differently to take advantage of the styles that they have defined.

    Not so much an issue, just time consuming.

    ReplyDelete
  5. How did you end up parsing the user-agent value? I was just taking a look at this list of 10,000+ user-agents. LOL.

    Another good mobile ui library is http://jqtouch.com/

    ReplyDelete
  6. Found a google code project that seems to do the trick. http://code.google.com/p/php-mobile-detect/

    ReplyDelete
  7. I will definitely look into that -- for the sake of proof of concept I was just checking if the user agent string contained the few most common phone types.

    ReplyDelete
  8. Oh, for sure.. It's probably the least of your worries if you are trying to get one of these mobile frameworks to work well.

    Btw, jqtouch seems to be a little too new to use. It works decently on an Android OEM browser but fails horribly with Opera. Found this out a week before a product demo!! X-0

    ReplyDelete
  9. how do you set the new theme in the main.php?

    ReplyDelete