Going mobile

Monday, February 18, 2008

Over the weekend, I decided to whip up a mobile (iPhone) version of Playground Blues. I walked into Broadway Cafe around 3pm on Saturday, and by 5:30, I had m.playgroundblues.com. Here’s how it went down.

Step 1

Since I’m still using Dreamhost and FastCGI, I created my .htaccess file along with my dispatch.fcgi file for my new sub-domain as usual. Made one little change to my dispatch file: instead of having DJANGO_SETTINGS_MODULE pointing to playgroundblues.settings, I pointed it to playgroundblues.settings_mobile.

Then, in my project folder, I made a duplicate of my settings file and renamed it to settings_mobile.py. Let me emphasize again, this is a duplicate.

Step 2

Created a new templates folder and named it “templates_mobile.” Opened up my settings_mobile.py file and added a new line to the top of my TEMPLATE_DIRS tuple. This tells Django to first look in mobile templates, and if the template doesn’t exist, fall back on regular site templates. (Remember, this is only for my mobile site.)

TEMPLATE_DIRS = (
  "/home/playgroundblues/templates_mobile/",
  "/home/playgroundblues/templates/",
)

Step 3

In my new templates_mobile folder, I created a new base template called base_mobile.html which I’ll use to extend in all my child templates instead of the main sites base.html. Then I went through the sites pages and recreated mirrored templates in the mobile folder. So /templates/blog/post_detail.html was overwritten by /templates_mobile/blog/post_detail.html. I stripped out extraneous content that was unnecessary for someone on the go, leaving core content and functionality.

The nice thing is if someone happens to creep into a section that you haven’t gotten to (as long as you didn’t override base.html), your site will display as it would on a computer proper. If there’s a more succinct way of doing this, please let me know.