How Do I Make My WordPress Site More Mobile-Friendly?

We often get people asking how they can make their websites more mobile friendly. With mobile devices taking over daily lives by storm, you definitely want to make sure your site is usable on mobile.

Mobile devices are becoming more sophisticated each day, so the bridge between regular browsing and mobile browsing is getting shorter, but there are still many ways to make the browsing and even shopping experience simpler for your mobile users.

For this post, we’re going to look at an easy to make your WordPress site mobile-friendly. Over the years, I’ve tried a number of out-of-the-box solutions, but always found they were limited and many times they even reduced the usability of the site.  It was kind of frustrating, so I gave up for a while.

But then I found out there was a pretty decent solution right under my nose. Lynette Chandler, my go-to tech gal and friend since 2003 (at least, it may have been 2002…my memory is foggy) has released a slick premium mobile plugin called MobiPages. It optimizes your WordPress for iOS (iPhone/iPad), Android and other devices.

How MobiPages Works

When you install MobiPage, you then can start making modifications to the way your mobile site is laid out. You can also edit the themes to a variety of colors, which I’ll show you at the end.

Make a Welcome Message

You can make a welcome message on the main page of your mobile site. The plugin includes a WYSWG editor, as you can see below. You can also use the HTML editor, if you prefer.

Once you’ve updated you message, it will appear at the top of your mobile site’s home page:

Edit Your Content Tabs

Then you can edit the 3 tabs that appear below your main message. When a user clicks on the tab, they will be taken to your custom text. You can add a sign up form, information, links or whatever you’d like.

Once you’ve updated all 3 tabs, your mobile site will look like this:

Edit Your Custom Page

Now, you can edit the “Custom Page” which is the 3rd link at the top of the mobile page after “Home” and “Blog”. I am choosing to create a “About Us” page.

Then my page is ready on the mobile site:

Update Your Facebook and Twitter Links

Now you can add your Facebook and Twitter links, if you want.

Then the Facebook and Twitter icons will automatically appear at the bottom of the mobile site.

Customizing Styles

The plugin also allows you to choose from some premade colors and styles. All you do is choose what you want for the background, navigation and style. Then you’re good to go.

And since I love red, here’s what I came up with.

Overall, it’s a pretty sweet plugin and our mobile page is now live for our blog. If you want to check out the plugin, go to the MobiPages information page.