Web-based mobile apps in drupal

| Last Updated: | In: Drupal, Drupal Beginners


Web apps are HTML5, CSS, and JavaScript-based apps running in mobile browsers. There are two different ways of building mobile web applications that work with Drupal – integrated with Drupal at the theme layer, or a standalone mobile web app that talks to Drupal using web services. Either approach will work for building mobile web applications, but it is easier to get started by integrating the mobile web app into Drupal as a theme.

Web-based mobile apps in drupal

Mobile Web Toolkits

Several different mobile web application toolkits exist, with varying degrees of support for smartphones, tablets, and feature phones. The two general approaches to building a mobile web application toolkit are to work from HTML5/CSS (jQuery Mobile, jQTouch), and to work from Javascript (Sencha Touch, Enyo). The HTML5/CSS toolkits are somewhat easier to adapt to Drupal. The Javascript frameworks don’t integrate with Drupal at the theming layer, so the process for development is similar to building a native mobile app

Additional Resources for jQuery Mobile and Drupal

  • drupal.api.js – An object oriented JavaScript API library to interact with Services 3.x. Great for use within Drupal Mobile applications such as PhoneGap, etc.
  • Building a mobile site in 45 minutes using Mobile Tools and Jquery Mobile – presentation by Michael Herchel at Florida Drupal Camp 2012
  • jQuery Mobile – presentation by Jason Savino on the Mobile jQuery theme and the jQuery Mobile module at DrupalCamp New Hampshire 2011
  • Building a mobile Drupal site – presentation by Mark Jarrell at DrupalCamp Nashville 2011
  • Drupal on the go with jQuery Mobile – presentation by Tim Cosgrove and Brian McMurray at DrupalCon Chicago 2011
  • 960.gs on jQuery Mobile – not a Drupal module, but still useful if you are planning to build web applications for tablets with jQuery Mobile
  • jDrupal – JavaScript Library for Drupal Services

Converting D7’s default XHTML to HTML5

The easiest way to convert Drupal 7’s default XHTML markup into HTML5 is to use a theme that is written in HTML5. If you are building your own custom theme for a site, consider using a HTML5 base theme as it will have done all the hard work to convert the default markup into HTML5 for you.


About: Prem Tiwari

Prem Tiwari is the founder of freewebmentor.com and is a professional developer who has vast experience in PHP and open source technologies. Apart from this, he is a blogger by hobby.


You may also like: