Follow BlogTips via RSS Get BlogTips updates via Email Follow @SM4NP - Social Media for NonProfit

Automatic mobile themes for your blogs

Posted on Jun 6th, 2010 by

My iPhone faked

More and more people browse blogs from their mobile devices. While you can view any website from your iPhone or Blackberry, the pages will appear with a very small font, and the whole thing will look very cramped, unless if the website supports a mobile theme. Only then, the site will appear suitable for easy mobile browsing.

Mobile browsing will increase in popularity: Few mobile phones are sold anymore without a browser functionality.  The price of 3G mobile network access is going down, and WiFi hotspots spreading like wild fire.  So if you think about expanding the functionality of your blog, think “Mobile Themes”.

A mobile theme enabled website will either automatically detect the visitor uses a mobile device, or at worse, the user can use a dedicated URL like mobile.yoursite.org, m.yoursite.com or mob.yoursite.com to access the mobile version of your website.

Theme-ing a site for mobile users is not for those faint of heart or for the bloggers with two left hands when it comes to the technical side of blogging. Theme-ing a site requires quite some skills. Luckily if you don’t host your blog on your own server, but use your blogservice to host it, all the work is done for you. That’s right: you don’t have to do anything, mobile themes come with the package.
On Tumblr, Posterous and WordPress.com that is. Blogger, as with many features, stays behind once again.

1. Mobile themes on Posterous

I wrote before about the new Posterous mobile phone theme, which automatically detects when a visitor uses a mobile device. Just like many features of Posterous, the theme is simple, clean but also really “plain vanilla”: apart from browsing the different posts, there are not many bells and whistles one would expect.

Posterous on iPhone look

Posterous on an iPhone

Goodies like commenting, subscribing a Posterous blog, or a blog search are not included.

2. Mobile themes on Tumblr

Tumblr, the competing vanilla blog platform, already featured an automatic iPhone theme since a while. Mind you, that is “iPhone” and not “any mobile device”.

I use Tumblr quite extensively for a series of simple blogs aggregating content from other sources: check out AidNews, BloggingToday and NonProfitBlogs. It is also my preferred tool to collect my webclips: check out TheHorizon. Let’s have a look how these show on the iPhone:

AidNews on a mobile theme

A simple Tumblr mobile themed blog: AidNews

Yep, indeed, AidNews does not feature any pictures, so that looks a bit ‘too’ plain vanilla, right? How about this for a taste:

Blogging Today in a mobile jacket

Browsing posts on Blogging Today

Nice, no? You just swipe from post to post. If you click on one, then this is how single posts look like:

Single post on AidBlogs

A single post on AidBlogs Mobile

Still too plain vanilla for your taste? Well, since a month or so, Tumblr allows you to customize this mobile theme, so you can add features, such as comments, and a blog search to your heart’s delight.

3. Mobile themes on WordPress.com

Remember there are two flavours of WordPress: WordPress.org and WordPress.com. As I covered in my primer “Which blog software to use“, the first is the self-hosted version and on the second, your blog is hosted by WordPress itself.

WordPress.com features the most complete and sophisticated automatic mobile theme-ing of all blogplatforms.

While you will get a mobile version of your WordPress.com blog on any mobile device, the full bells and whistles will only show on phones with a “rich” web browser, like the iPhone and Android. The end result is truly impressive:  not only do you get access to the posts, pages, and archives, but you can also comment and search the blog. This is how it looks like:

Multiple posts on WordPress.com mobile

Multiple posts on WordPress.com mobile

Now, that is what I call a “mobile theme”! Each post shows a summary with the date, author, categories and the number of comments

Expanding a mobile post on WordPress.com

Expanding a post on WordPress.com mobile

When you tap the “down arrow”, you get a preview of the post.

Viewing a single post on WordPress.com mobile

Viewing a single post on WordPress.com mobile

And that is how a single post looks like.

Viewing pages on WordPress.com mobile

Viewing the pages on WordPress.com mobile

Tapping the “down arrow” next to the banner, shows the pages, archives and a search bar.

Search results on WordPress.com mobile

Viewing search results on WordPress.com mobile

And that is how search results show up. Each can be previewed by tapping the “down arrow”, or shown in full by tapping the post itself.

Commenting on WordPress.com Mobile

Commenting on WordPress.com mobile

… and commenting could not be easier.

4. Mobile themes on Blogger

After all of that WordPress splendour comes the anti-climax. Blogger.. Aaah, unfortunately, Blogger once more leaves its users high and dry: mobile theme-ing is not supported, unless if you exchange your blog template with a mobile template…. which would mean that “normal browsers” would see the mobile template too. And that is not what we want.
Since the writing of this post, Blogger has implemented automatic mobile themes. And they’re pretty good, actually!

Cartoon courtesy Geek and Poke




7 Comments to “Automatic mobile themes for your blogs”

  1. Pamela Scott says:

    Does blogger blog have such feature? Just wondering. I’m just starting blogging. And I’m using blogger.

    Cheers,
    Pam

    • Peter says:

      Hi Pam,

      See point 4: no, Blogger does not have such a feature.

      If you start a new blog, I would give WordPress.com a serious look. Give it a try, and see how it feels. Much more versatile and easier to use than Blogger. WordPress.com does restrict you what you can put in sidebars and posts (e.g. no scripts,…)

      Peter

      • Heiko says:

        Hi, blogger.com supports mobile theme by default – I also thought it would not work – but try to add ‘?m=1′ after the .html of a blogger site and the mobile version is shown…
        I discovered when surfing on webmastercentral at google and wondered how they do it… just need to add the string above. The only thing I did not figured out yet how to set it automatically…
        cheers,
        Heiko

        • Peter says:

          Hi Heiko, I did not know this secret html trick for Blogger.– Thanks!
          I have seen though, that http://draft.blogger.com allows you to automatically enable mobile themes… Might be worth a try…! Let’s hope they enable that option soon in the production Blogger-engine…

          Peter

  2. Harry Dill says:

    Such a wonderful put! I like blogging and Hope the approaching hits will be this ample too. Thanks for such blogging tips giveaway! That’s all useful!!

  3. Oska yoyo says:

    What a great mobile themes for our blogs!! I’ve enjoyed the formation of this blog pretty well……. People will fell satisfaction using these mobile themes. Keep up great feelings buddy :)

  4. iPhones need applications like these one. I highly recommend it.

Leave a Comment

*