Creating a WordPress Mobile Site without Plugins

As you can imagine, I'm tired of hearing or using the word “responsive” already. It was a great word in the last part of 2011, but it's like those custom paint colors that today you look at and know immediately – that was so 1999. Right? So let's just skip past the responsive word and talk about responsive sites. And yes, the use of responsive twice in that last sentence was on purpose.

In the Old Days

If you were trying to create a mobile site a couple years ago, you'd be looking for a great mobile WordPress plugin, like WPtouch. Now, to be clear, there was nothing wrong with that plugin – and there still isn't. It comes with a great set of features and a lot of control over what shows up when you're looking at your WordPress site on a mobile device. But there were some challenges as well – like you knew the site was a shadow of it's real self, and that most of your styling disappeared.

These days it's all about being Responsive

So the word “responsive” simply means that your WordPress site is coded in a way that reacts (hence the term) to the different sizes the browser may find itself in. If you think about it, there are at least four sizes you care about – on a large monitor, on a tablet, on a mobile device in landscape form, and on a mobile device in portrait. So if your site can adjust to those four sizes, then you could call it “responsive.” Now, that's not the technical definition, but for the non-tech audience, and in terms of objectives, it's good enough.

So how do you do it?

The easiest way is to pick a theme that already does it for you. I know. Not rocket science. If you're a programmer, there are great resources out there to help you – like this free¬†skeleton theme, or tutorials and articles over here. But let's imagine you're not a programmer (because most of you aren't). Then you visit a site like WooThemes (to look for some of their newer sites) or visit ThemeForest and search for “responsive” while in their WordPress category.

That's how it's done. Once you pick a theme, you'll be nearly done. You may have to adjust some of your widgets, but if you've been using features like WordPress' featured images for your posts, they should automatically use new CSS media queries and adjust your text automatically, and you'll have a mobile site without a plugin.

Want some Inspiration?

Check out this list of 60 different responsive sites to get you excited about upgrading your own site. Tell me which one you like best.