Using Mobile Devices with Drupal : Presentation

Submitted by alunde on Tue, 11/20/2007 - 16:35.

Using Mobile Devices with Drupal

a.k.a.

Dr. ChangeUp -or- How I learned to stop worrying and embrace the user agent string.

By Andrew Lunde of Lunde Cognitive Effects, Inc.

November 20th 2007

  1. The Challenge:
    • Create a site with multiple themes for different users coming to it in different ways from different devices.
    • Site supports multiple groups of users that will have their own theme within the site but still be part of the whole main site.
    • Users can browse to the site with standard web browsers as well as mobile phones
      • Text Panthers to 10812. SMS message will be sent to the mobile phone that will automatically log you in. Expired at midnight 11/20
    • The site can also be embedded into other sites.
    • Mobile Devices Issues:
      • Screen is small and may not support 64K colors or web pallet.
      • Fonts vary from device to device and can't be relied on to render consistenly
      • User input is VERY limited. Usually to up/down/left/right and enter + the numeric keypad. Some softkeys work, but not consistently. Freeform text entry is cumbersome due to tripple-typing each letter. T9 and full keyboards alleaviate this somewhat but characters like :, /, . and & pose problems.
      • Phone based browsers often don't support CSS/Tables/Frames/iFrames/Javascript/WAP/all type of images/audio/even meta refresh. Can't rely on caching.
      • Most will support the basic modes of SMS and launch the browser via a link in the SMS message.
  2. The Approach:
    • Use Drupal's theming, multi-site, groups, custom types, and custom code.
    • Key Modules:
    • Multi-Site.

      If you can control your domain's DNS and create several sub-domains, you can use this and Drupal's multi-site to control which theme is used when browsing to which sub-domain. This is controlled by creating a folder with the name of the hostname in the sites folder and placing a settings.php file in that folder. So for panthers.gameup.mobi it would be sites/panthers.gameup.mobi/settings.php.

      Notes:

      • Set the cookie_domain variable to your domain.com so that user sessions will be retained across switches to other sub-domains.
      • Override system variables by defining them in the $conf structure including the theme. (Theme must be loaded and activated.)
        $conf = array(
        'site_name' => 'Panthers',
        'theme_default' => 'panthers'
        );
    • Mobit
      • Switches theme based on the User Agent String in the browser request.
      • Tries to match a list of know phones. nearly impossible
      • I inverted the check to only look for known browsers
      • A more robust solution would be to employ Tera-WURFL www.tera-wurfl.com/ and WALL4PHP also this Druapl link:http://drupal.org/node/79114
      • Had to hack drupal/includes/theme.in Couldn't find a hook that would work. help
    • KISS for Mobile
      • Rules of thumb, Keep It Simple Stupid
      • Don't rely on blocks or frames or drop-down navigation
      • Keep the content in a single column if possible
      • Put important links and buttons at the top so the user doesn't have to scroll any more than needed
      • Don't put links side by side if possible
      • Only put as many links/buttons as absolutly necessary to perform the task
      • Consider drill-down and back-out for navigation
      • Consider your own login/register/forgot password functions
    • Groups
      • Use organic groups for each themed groups of users
      • Create a group "home page" view
  3. Other Stuff:
‹ June 10 Drupal Workshop Is there an agenda for the July meeting? ›
»