It would be fair to say that mobile design is not a topic we have shied away from here on the ManageWP blog. But today I want to put the controversy to one side and assume two key things:
- You want a mobile design for your WordPress site
- Your existing theme isn’t responsive and you have no intention of changing it
One might assume that the above scenario precludes you from offering up a design for mobile users, but that is not the case. In fact, there are a few plugins on the market that can take your site and convert it into an app-style interface for mobile users.
Today I want to focus on the most popular one — WPtouch. Is it the solution you have been looking for?
Attempting the Impossible?
WPtouch is developed by the chaps over at Brave New Code — a name you may recognize from expert roundup posts we have published in the past, such as How to Improve the WordPress Plugins Repository. They took on the unenviable task of creating a plugin that can convert any WordPress site into an attractive and functional app-style interface.
To be perfectly honest with you, I would have considered such a feat impossible. Different WordPress designs throw up so many different variables that I couldn’t imagine a “catch-all” plugin offering a consistent solution.
However, I now know better.
Introducing WPtouch
In order to put WPtouch through its paces I decided to offer up my own blog as a guinea pig. Here’s how it looks on an iPhone 4 in portrait mode:
As you can see, the non-responsive desktop design holds up pretty well on the iPhone display. Now let’s take a look at the WPtouch app-style interface:
This is what you get from simply installing and activating the plugin — before you have touched any of the settings. Impressive, no?
The way in which the developers have managed to pull all of the most important information into a clean and intuitive display really showcases (a) their talent, and (b) the ease with which information in WordPress can be manipulated.
The design you see above remains pretty consistent throughout the different pages and displays on your blog, as you can see from the screenshots below:
But installing WPtouch is just the first step.
Tweaking Your WPtouch Theme
WPtouch offers up an enormous number of customization settings, so I am just going to run through the most useful.
The first thing you will want to consider is how posts on your homepage are presented. For instance, categories on my blog are a complete mess, so I want to hide them. I also want to display the post thumbnail and remove the author name (it’s always me). All easily done:
The above settings adjustments result in what I consider to be a far better presentation of my homepage:
Moving on, there are a bunch of advanced customization settings which I have tweaked to my liking:
And although WPtouch’s interface is (by necessity) rather rigid, you do have the option to change some of the fonts and colors:
Finally (and please note that I have not covered all of the available settings), I found it incredibly useful that I could select which specific pages I wanted to show in the navigation menu, because I have a whole bunch that I would not typically want to display:
An Incredibly Intuitive and Simple Solution
Quite frankly I am blown away by how easy it was to get my own app-style website up and running. I achieved all the above in about ten minutes. If it weren’t for the fact that I am pretty happy with how my site’s desktop display renders on most mobile devices, I would be using WPtouch without hesitation.
Whilst there are alternative options out there (such as the Jetpack Mobile Theme Module), WPtouch is by far the most popular solution and is developed by a great bunch of guys. I wholeheartedly recommend it to anyone who is looking for a simple mobile solution for their website.
Furthermore, there is a premium version available with even more options — you may want to check it out. If not, you can download the free version here.
So what do you think — is an app-style interface like WPtouch to your taste? Will you be using it for your WordPress blog? Let us know in the comments section!
Seema
hi,
I installed the plugin, it seemed to work greatly but then when i browsed from android, then the codes of the visual composer were visible instead of the actual post.. 🙁
also i can’t select the latest post to be shown as landing page.. is there any solution?? i have deactivated it at this time..
Seema,
http://seemaye-web.com
It News
great article , thanks you
Sam
I am looking in to other options because even after 3.0 version, the customization (look and feel) is somewhat confusing. But I should give credit to WPTouch for making a great plug and play type application for mobile sites.
Lachlan
The unfortunate thing with WP Touch is that it filled a space for small amount of time when we had no idea how to treat mobile web design. It was a great solution when it was first released but it dated very very quickly.
The best option it to either develop or purchase a responsive WordPress theme. This at least allows you to keep the styling of your website.
I dont mind Jetpack’s mobile theme because it is at least very minimal and keeps focus on the content, but I can see it dating quickly too http://jetpack.me/support/mobile-theme/
Seema
hi Lachlan,
I read your comment and installed jebpack mobile.. but it doesn’t seem to be compatible with the visual composer.. like it shows the codes of it not the actual posts.. do you know how to solve it please??
Seema,
http://seemaye-web.com
Robert leo
Its a very good plugin and easy to adjust the setting according to our need.
But i need your help.
Dear Tom, this plugin is not working for me. when i check my website on android , it looks same as it look in desktop.. kindly help me if you can..
Jose
Thank you for the article 🙂
Shane
I’ve tried it out a couple of times and installed the Pro version one of my client sites (they seem to be happy with it). My main wish, which most have stated here already, is that they gave an easy customizable homepage template instead of just the blog version. I haven’t created a site in ages that just looks like a blog and some clients don’t even use the blog features in WP. I just downloaded the latest version with my pro account and am going to give it another shot because it definitely is packed with features that I would love to utilize for mobile. Thanks again for another steller post!
Tom Ewer
No problem Shane 🙂
Shane
No problem! I’ve recommended it to multiple clients, as well – hope it helps in sales!
Is there a way to customize the look of the template to make it like a responsive mobile site? I’m sure there is but I haven’t checked it out in a while; the default theme is pretty solid but some upcoming clients want more bells and whistles 🙂 thanks again!!!
Claudia Hall Christian
I’ve used WPTouch for years, but moved away from it in the last six months or so as it sometimes supersedes the actual theme even when visited via the Web. I’ve never seen any one talk about this issue and would love to know if there’s anything that can be done. My readers really like WPTouch, but again it’s a nightmare for our store and web presense
Farhan
I’ve been a user of WPtouch for almost a year and own developer license but finally shifted away once I saw http://www.obox-design.com/wpmobile.cfm which was also recommended by woothemes.
Primary reason was WPtouch is just hard if your site’s homepage is not a blog! You need to make a custom template etc
herman dailybits
I used for a while, but a big disadvantage is the lack of analytics integration ( you have to hack the confusing theme files yourself). Now I`ve built a responsive solution which gives 1 userfeeling.
Adam Teece
I have used WP Touch a lot in the past and it is very nice. I don’t think it is the perfect mobile solution for every case though.
As a marketer I also don’t think that responsive design is always the best solution. The context of what a person is doing on your site will usually change based on what device they are on.
With that said I think if your site has a call to action then that call to action might be different depending on if they are on a phone or what not and I have had good luck with basically building mobile landing pages for a lot of clients because people aren’t visiting their site to browse the entire site, but for a specific purpose.
Duane Storey
Responsive design works for some sites, but I would disagree that it is a solution 99% of the time. Often you end up with fairly unusable mobile version, since you’ve basically just taken your desktop website and tried (often unsuccessfully) to reformat it onto a mobile device. Many desktop themes make use of features that simply don’t translate well to mobile (such as sidebars), and those often get simply discarded without any thought on the mobile device – that information is lost, and generally doesn’t end up anywhere. In addition most of the resources (think large images) are formated for desktop sizes in a responsive design and are excessive for many smartphones and mobile devices.
And sure, WPtouch does browser detection to figure out the type of device it is on to know what type of theme to show. But even a responsive design requires detection as well to determine what type of CSS to show and the browser/device capabilities, it’s just often done via CSS/Javascript instead of looking at the user-agent.
If you notice glitches on various devices while using WPtouch, it’s often because a caching plugin for WordPress is active and it hasn’t been configured properly.
Thanks for the review though, and for the feedback, Francesco.
Duane Storey
BraveNewCode Inc.
Tom Ewer
Hey Duane,
Thanks for commenting.
There are a lot of passionate responsive design advocates here at the ManageWP blog (which is great), so you have to take your medicine if you want to propose alternatives 😉
Having said that, I broadly agree with your views. Responsive design is *a* solution, not *the* solution.
Cheers,
Tom
Francesco
Well, keeping in mind that a responsive site is, 99% of the times, the best solution (sorry, man! 🙂 ), this plugin is pretty good, I’ve used it for a long time.
I admit I did have a few problems with it some time ago, testing the site on various devices gave unexpected results. Certainly because it’s based on sniffing, and sniffing is bad.
So I had to turn it off and now I just activated the Jetpack mobile version and it seems to work a bit better (of course that’s also sniffing, so it must have its flaws too).
But that’s probabily me, it’s a good plugin.