How to Go Mobile With Your Existing Drupal Site

f you have not jumped on the mobile bandwagon yet, now is the time. Drupal’s Mobile tools module makes it super-easy to optimize your existing site for mobile and other devices. It’s just a few hours of work to mobilize a site with standard layouts – let’s say a blog or news site. If you are building a site from scratch, you can right away use responsive themes. Else, here’s what you need for a basic mobile site implementation.

  • Drupal’s Mobile Tools module
  • Custom mobile theme

 

Mobile Tools

Right off the bat, you have two ways of going about mobile implementation.

  • By creating a separate mobile site with a mobile url like m.mysite.com and redirecting the users if they access the site from a mobile device or
  • By rendering a different site/theme in the same url depending on the device from which the request comes

Whichever option you choose, Mobile tools is the module to help you with that.

Here’s a gist of what it offers you:

  • Detecting visitors viewing your site from mobile devices
  • Re-directing mobile visitors
  • Switching themes based on device
  • Switching theme based on device type (Android, iOS, Blackberry, etc.,) by integrating with external modules like WUFRL or Browscap

The best part about Mobile Tools is the granularity it offers – like limiting permissions for mobile users. Every user is given a role through browser detection and you can even decide what menus mobile users can see with the Menu per role module

If you are considering the first option of creating a separate mobile site,you should transition intomulti-site installation to make Drupal maintenance easier. Even though Mobile Tools works best for sites with a separate mobile site, for SEO reasons the second option is highly recommended. Even from the user-experience point of view, having a single url makes it easy for your users to interact with, share and link to your content.

Custom Mobile Theme

Building a custom mobile theme is the most important part of the whole exercise because, that defines the mobile user experience. Building it is easy and intuitive for the reason that it is similar to building a theme for low-bandwidth – doing away with all the riff-raff of the existing design itself should yield decent results.

If you are considering building a theme from scratch, Fusion mobile or Nokia mobile theme can be good starting points. Alternately, you can also consider options like Mobify Studio that makes mobile site deployment a cinch. It offers a slick interface to drag and drop content areas from the desktop website, which can then be edited on screen to create a custom template.

Whichever approach you take, mobile theme deployment will involve a lot of testing on various mobile browsers that devices ship with. The best way to go about it is by using a web-based device simulator.

Managing Layouts and Images with Mobile Tools

If you are not too keen on using third party services, you can consider Panels which integrates with Mobile tools and makes it easy to manage page layouts for your site based on the device. Also, CCK’s ImageField and ImageCache options will get you covered for mobile image optimization.

Things to keep in Mind

Caching

If you are rendering different site themes for the same url depending on device, you will have to consider the fact that, under normal caching, Drupal web development atlanta will serve cached pages that don’t take the theme switching into account. Mobile_tools_cache.inc file offers instructions on how to enable caching to avoid this situation.

Persisting sessions between mobile and desktop sites

This only concerns those using separate urls for the desktop and mobile sites and wants to help their users to easily switch between both sites without losing the session.

This post gives a basic overview of mobile implementation. If you have a more complex requirement and you need assistance, please feel to contact us.