March 2009 – Liquidninja

frostninja-mobile

As I continue to browse the web on my beloved iPhone, I occasionally visit a blog that’s perfectly sized for the device. Basically this saves me a double-tap (which would zoom in on the article text) but anything that makes people think less is just awesome!

I recently decided that I wanted my own blog to have a similar feature: detect mobile browsers and present a different skin or theme to them. Getting this done was slightly trickier than I had expected.

An important note: if you’re using a caching plugin for WordPress you may have problems with serving different flavors of pages depending on the client’s browser. Luckily WP Super Cache, which is updated fairly frequently recently added a “Mobile device support” option for just this purpose.

First I tried the plugin called wp-mobile. This one looks just great on an iPhone. Unfortunately it just wouldn’t work for me. (Yes, even after disabling wp-supercache.) I also wasn’t a big fan of the complexity that the carrington theme comes with (since theme customization was one of my goals).

Next, I tried the much simpler MobilePress. This one just worked right out of the box with a couple caveats. First, it didn’t play well with Disqus (the cool distributed comment platform this site uses). The Disqus comment text came up the same color as the theme’s background so the comments were completely unreadable. I fixed this by changing the body background color to a lighter shade. The second caveat I’ll get to in a moment.

After MobilePress was working I decided to customize the default theme to give it the same feel of the main theme on this site, FrostNinja. (For those curious, I wrote a post on how I made FrostNinja.) To test it I used the technique described in the aforementioned article as well as simulating the iPhone on two of my desktop browsers. The picture at the top of the screen is Safari 4 with the developer menu enabled and the iphone user-agent set. I also tested with Firefox (mainly because I just love firebug!) with the UserAgent Switcher plugin.

Next comes the other problem I faced which was a bit nastier and I still don’t understand why it’s broken. I uploaded my new FrostNinja Mobile theme to my server in the correct place (plugins/mobilepress/themes) and successfully set it as the default, for all platforms, in the Mobilepress Themes setting page. But the default theme was still being served — even with wp-cache completely disabled! The workaround for this one is a bit uglier: after renaming the existing themes I symlinked both to my new theme (e.g., “ln -s frostninja-mobile default”).

Overall a fun experience and I’m pleased with the result.

Update: At some point this mobile theme stopped working yet again. Rather than keep debugging it I turned it off in favor of a responsive solution. This has many benefits including way fewer moving parts. Here’s how it looks on mobile:

metapad-10yrs

It feels great to say that after a full decade I still enjoy using metapad on all of my Windows installations.

Today marks the 10th aniversary of the first public release of metapad (see the history page if you don’t believe me). To celebrate I have finally, after long promise, released the source code for metapad. That’s right, now metapad is officially open source and available on GitHub. Not just freeware but truly “free software”, as is defined by the FSF.

I started developing metapad back in early 1999 when I was an intern at a very cool Toronto based media company called (at the time) Digital Renaissance. It was my second internship there and I had graduated from VB programmer to C++ programmer (woohoo!) and I was pretty stoked to be learning the ins and outs of hardcore object oriented Windows programming with MFC. But I guess I was pretty good at squashing the bugs they were throwing at me because I had a lot of free time on my hands…

So I decided to write my own text editor — one that was as fast and lightweight as Microsoft’s Notepad but had some serious features that people could use to, say, write the front-end code for a web site. Plus back in ’99 most folks still used these things called modems so downloading software was a pretty big deal. The fact that the initial release of metapad was less than 20 kilobytes was an important factor in its relative success. (Competing products that relied on fat runtime libraries were ten to fifty times larger than metapad).

Other than the superiority of metapad’s size, speed and feature list, there were two other major factors contributing to its overall success: suporters and multiple language support.

Very soon after metapad was released, an up and coming tech email newsletter called Lockergnome run by one Chris Pirillo, decided to recommend metapad. A little later on, I was very proud to get a 4 star and then an upgraded 5 star editors’ pick rating from ZDNet, the publisher of the once popular and powerful PC Magazine. A sincere thanks goes out to Chris and to the editors at Ziff Davis as well as all the other sites around the world that helped to spread the word about metapad.

In the year 2001 I came up with the idea to let volunteers translate metapad’s user interface (very similar to what Facebook has recently done). Thanks to the dedicated efforts of some computer savy, multi-lingual metapad users from around the globe, metapad is currently available in 32 languages other than english (each available as a downloadable plugin).

I was amazed to discover that since I installed Google Analytics in late 2005, there have been 442,881 visits (generating just shy of a million pageviews) coming from 212 different countries! Here’s a graph of the visitors by country (breaking out the top 10).

Special thanks to Florian Balmer, Aaron Hawley, Carlos Fleitas and all the other users who submitted bug reports, feature requests and kind words. All of your feedback and support was what drove me to improve metapad from v1 to v3.5. Big thanks to all who have sent donations which have generously helped me maintain the website.

-Alex

Month: March 2009

Liquidninja Goes Mobile

metapad turns ten