November 29, 2010

Have you made your site mobile-ready?

Socialmedia.biz on a mobile device

How Socialmedia.biz looks on an iPhone 4 without WPtouch Pro, left, and with it.

WPtouch Pro plug-in: Better than creating your own app

JD LasicaThe other day my partner Christopher S. Rollyson asked, Why haven’t we optimized Socialmedia.biz for mobile users?

Truth be told, we have so many balls in the air that I hadn’t heard of WP-Touch or WPtouch Pro — WordPress plug-ins that make your site really nice-looking on a handheld device. With use of smartphones exploding, this is now a must-have in today’s marketplace. Morgan Stanley analyst Mary Meeker predicts that within the next five years “more users will connect to the Internet over mobile devices than desktop PCs.”

So let’s get geeky for a minute here and do mobile visitors to your site a huge favor. Because you definitely don’t want your site to appear like the BEFORE image at the top of this post.

A couple of months ago, we paid to have Appmakr create an app for Socialmedia.biz. You can download the Socialmedia.biz app to your iPhone — just search and install “Socialmedia.biz” in the App Store. Since we’re an editorial site, the app doesn’t do anything beyond nicely displaying headlines and text summaries sucked in via RSS feeds. Behold:

Screenshot of Socialmedia.biz app in App Store

Screenshot of the Socialmedia.biz app in the App Store

Now, the big drawback here is that very few people are likely to install an app just to read a single website. What you really want is for your site to be mobile-enabled across a wide range of devices — with no download required on the user’s part. Here’s how to do that.

WPtouch Pro: Buy a license for up to 5 sites

I quickly discovered that WPtouch Pro from Canada-based BraveNewCode was my answer. If you run a business, nonprofit or personal site using WordPress and you haven’t mobile-enabled your website or blog, you really need to spend the few bucks and 5 minutes it takes to make it happen.

Here’s what you need to do:

1. Go to the BraveNewCode site and buy a license. Need it for just one site? $39 Canadian ($38.16 US). Need it for two to five sites? $69 CAN ($67.52 US). It was $10 cheaper when I bought the 5-pack about two months ago.

2. Download and install the plug-in the same way you install all your WordPress plug-ins. Activate it.

For most online publishers, that’s it! Now go to your favorite browser on your mobile device — say, Safari or Firefox — and you’ll see your website reincarnated and mobile-ready. Your latest blog posts will look something like this:

SMbiz-twitter post

Your site will be mobile-ready for 90% of the marketplace

What devices does this support? iPhone, iPod touch, Android, Palm Pre/Pixi and BlackBerry Storm. Or, as the BraveNewCode folks put it: “Over 90% (and growing!) of the mobile-web surfing world will see your incredible mobile website with WPtouch.”

One coding caveat: If you use WP Super Cache, you’ll need to go to your plug-in’s settings and click the checkbox to enable “Mobile device support.” If you use W3 Total Cache, you may see some caching issue. Originally none of our posts from the past 10 days were appearing, but now it’s working fine.

Another bonus: WPtouch Pro will display not just your most recent blog posts. Users can call up other pages or sections of your site, and they can email friends with a link to the post, tweet it out, add a social bookmark, add and read comments and scale images (although in my experience I haven’t been able to enlarge the text, though it’s sufficiently readable).

If you’d like to see a video of how this all works, take a look at the YouTube video WPtouch WordPress Plugin Demo for the Lifestream Blog. My understanding is that the free version of WPtouch is still available but is no longer supported, and you won’t get the free updates that come with the paid 2.0 version.

How to grab screenshots off your iPhone

By the way, some of you may be wondering: How do you take a screenshot on the iPhone without using a special screenshot app? Simple. Apple changed this process during the summer, so here’s how it now works:

1. Call up the page you want to capture.

2. Simultaneously hold down the “Home” button at middle bottom of the iPhone’s front AND the “Sleep” button on top right of the iPhone. Press them for just a second or two. The iPhone screen will flash white for a moment as the image is added to the phone’s Photos.

3. Navigate over to Photos or Camera Roll on the phone and email or text (MMS) the picture to yourself. It comes as a .png or .jpg attachment. (Or, go wild and use it as your wallpaper.)

Does all this make sense? Have you mobile-enabled your blog or website?

Cross-posted to Socialbrite.org.JD Lasica, founder of Socialmedia.biz, is now co-founder of the cruise discovery engine Cruiseable. See his About page, contact JD or follow him on Twitter or Google Plus.

  • http://www.developmentnow.com Ben Strackany

    Good call on WPTouch. It's not the broadest coverage (e.g. for older phones) but is really easy to use & looks great. We've also had some success modifying the default theme for our clients that wanted the mobile experience but with their own branding & colors.

  • http://www.mobilova.com Christina

    hey JD,
    great article and description, for non techies and very busy folks out there, we have a solution as well as for big publishers, you should take a look at http://goo.gl/E6cZ6 , it’s a great service we just created to help peoples create mobile versions of their websites in less than 2 minutes.

  • Rich

    Did you look around for a wordpress plugin? WP touch makes your site look just – like – every – other WP touch site. Humph.

    Inject some originality – look around a bit. There's a GREAT plugin that actually allows you to maintain the style of your original site while making it work on every single mobile browser. It's simply called the mobile wordpress plugin.
    http://mobilewordpress.com

    simples

  • http://twitter.com/csrollyson @csrollyson

    JD, not to be overly simplistic, but I don't think it's an exaggeration to say that the 3rd screen will bury the 2nd screen, even more lopsidedly than the 2nd vanquished the 1st. The USA has been a laggard due to computer penetration, but, for many audiences, the 3rd screen will be how to reach them. I'm seeing this plainly in client work right now.

  • http://www.mitash.com Raj – SEO Australia

    Webmasters need to look at several devices to test how their websites are viewable on them. This will help them find any important information they are missing on the spot area. So they can make those visible even on tiny monitor.

  • http://twitter.com/Longzero @Longzero

    I really advise against using anything like WP Touch. Don't use templates. The worst part is that you can't zoom in. Why is that important? Well, just view this post on an iPhone or something and you can't zoom in the photos to have a closer look. It isn't such a big deal for this post since the images don't have significant details, but it's a big issue when there are relevant words on images.

  • http://wapple.net Rich Gubby

    Here is another plugin to try: http://wordpress.org/extend/plugins/wapple-archit

    It's called Wapple Architect and it works perfectly on every device, not just smartphones and new releases. In fact, it knows more about phones than any others, even delivering content to handsets that haven't even left the lab.

    It's currently free and will continue to be so for low-traffic sites – if you have a lot of traffic, we have some great plans – give it a go!

  • http://www.rantmedia.com/iphoneipadapplicationdevelopment Iphone App Creators

    A very nice plugin, tried and successful. I have also tried a few other plugins which is not good as this one. Thanks for the really helpful post.

  • http://www.cosc.com.au costcook

    Thanks for the post.

    I tried WPTouch and found it easy to use and install but the results were disappointing. There is not much flexibility and in this app. WpTouch Pro looks better and now there are other competitors in the market with some very powerful tools and flexibility.

    Making your site Mobile Ready is an essential as Search Engines no use it as a part of their ranking algorithms.

    P.S. Just tried to read Social Media on my Blackberry :( lot of screen size adjusting needed

  • Jobb Ship
  • http://mobifriendly.com/index.php/gallery/custom-mobile-websites/ Resell Mobile

    Mobile friendly website has become necessary as it lets you explore while you are on move – any time , any where. I would like to know software and plugin like WPtouch Pro is better or mobile application CMS that lets you manage your content, what are pros and cons of both bit confused. Thanks as your explanation about “How to grab screenshots off your iPhone” helps me a lot.