Drupal iPhone mobile themes, special introduction: In this article I take a quick look at the existing Drupal iPhone themes. The reason I say this is a "quick look" is because none of the themes seemed to work very well out of the box. This is a bummer for me, not only because I have a lot of work to do, but because I normally like to share solutions to problems.
In the end, I ended up following some CSS and JavaScript instructions from a terrific book to theme my own "Drupal iPhone app", and was able to create a much better iPhone look and feel than these themes offered.
Creating a Drupal iPhone app
Over the last few days I've been developing a custom, mobile Drupal application, specifically a Drupal iPhone app. I was hoping to find an off-the-shelf Drupal iPhone theme I could just plug in and start using, but sadly, this has not been a pleasant experience.
I've tried all of the Drupal iPhone themes listed shown below, but as you'll see from those images, none of these mobile Drupal themes does what I hoped for out of the box. I hoped that if I just followed the normal Drupal form coding and theme standards and plugged in one of these themes some really good things would happen, but alas, that didn't happen at all.
Thinking I might have made a mistake in my programming, I also went back and looked at the standard Drupal login form and other simple web pages, but sadly the results were the same.
Drupal mobile iPhone themes - Screenshots
I could try to describe the problems I encountered, but rather than write about it, I'll just show you a screenshot of each theme after it was applied to my very simple, very standard, Drupal form.
Nokia Mobile Drupal Theme
Here's an iPhone screenshot of the Nokia Mobile Drupal theme. As you can see, I left the breadcrumbs on the form to see what they'd look like, and my simple Drupal form has only three textfields, two with help, a Save button, and a Cancel link:
iDrupal UI Theme
Here's an iPhone screenshot of the iDrupal theme using that same Drupal form:
Fusion Mobile Drupal Theme
Here's an iPhone screenshot of the Fusion Mobile Drupal theme:
iWebkit Drupal Theme
Here's an iPhone screenshot of the iWebkit Drupal theme:
iUI Drupal Theme
Here's an iPhone screenshot of the iUI Drupal theme:
Drupal Mobile
Here's an iPhone screenshot of the Drupal theme named "Drupal Mobile":
Drupal Mobile Theme
Here's an iPhone screenshot of the Drupal theme named "Drupal Mobile Theme":
As you can see, out of the box, none of these themes look like an iPhone app.
Drupal mobile iPhone themes - Documentation
A hard part of trying to work with these Drupal mobile themes (iPhone themes) is (a) they looked like this and (b) the lack of documentation with the themes. A few themes send you to websites that show that the theme should work, but as you can see, out of the box, none of the themes look very good, let alone look like an iPhone app.
(Theme developers: If I've done something wrong please let me know. All I did was create a very standard Drupal form, set the default to each theme, then took a screenshot of the theme. For the record, other pages like the Drupal login page, simple content pages, and simple UL/LI link lists don't look good either.)
Drupal iPhone app development
Once I struck out with each of these themes, I went to Amazon and started searching for books about creating iPhone apps with just HTML, CSS, and JavaScript. Fortunately I found a wonderful book titled Building iPhone Apps with HTML, CSS, and JavaScript, and that book has made a huge difference. In fifteen minutes I was able to use his CSS examples to make the menus for my Drupal app look much more like an iPhone app. With a few tweaks to my Drupal theme files (page.tpl.php and the CSS files), here's what my Drupal menu looked like:
After some background information in the first chapter or two, the author also shares some tools that can really help with Drupal iPhone app development, things I wouldn't have learned if one of these themes had worked. While I'll have to do more work than I hoped for, the book demonstrates some terrific AJAX techniques that will help make my Drupal mobile app look and feel much more like a native iPhone app, which is what I really want.
Drupal iPhone themes and app development - Summary
While I struck out when trying to use the current group of Drupal iPhone themes, I've found some wonderful HTML, CSS, and JavaScript programming techniques that will help me create a Drupal iPhone app that will really look and feel like a native iPhone app. If there's anyway I can make this into a Drupal iPhone theme myself I'll be glad to share my work, but I don't know if and when that will happen.
books by alvin
 |
 |
 |
 |