How to Make Your Wordpress Site Mobile Friendly - 2 Easy Steps

How to Make your WordPress Site Mobile Friendly

April 7, 2015COMtnMom

If you’ve not heard the fun news, recently Google dropped a little bomb.  All websites need to be mobile friendly by April 21st:

“Starting April 21, we will be expanding our use of mobile-friendliness as a ranking signal. This change will affect mobile searches in all languages worldwide and will have a significant impact in our search results.”

In other words, if your blog *isn’t* mobile friendly by then, they are going to start tanking your posts in search results.

Good times.

How to Make your WordPress Site Mobile Friendly

How to Make Your WordPress Site Mobile Friendly - 2 Easy Steps

Following this discovery, I have been wrestling with my site for the past week or so.  Trying to get it mobile friendly for Google, because I’ve got nothing better to do. Hair has been pulled. Tears have been shed. Google has been cursed.

Anywhoo – It’s working now… and I discovered an easy tip, for any of you self-hosted WordPress bloggers:  Jetpack can serve up a mobile version of your site for you! Whaaaat?

Mine is a self-hosted WordPress blog, using the Genesis theme plus a child theme (called Adorable, which is no longer supported).  I took a couple of steps to get to Happy Mobile-Friendly Land.  I’m not 100% certain if the first one is required, but I’ll include it just in case it is.

1.  I added a viewport meta tag.  Under “Appearance – Editor”, you have access to edit your (theme, or child theme’s) functions.php file.  View it, find a place near the top after <?php, and paste in the following code.  Then save by clicking “Update file”:

//* Add custom Viewport meta tag for mobile browsers
add_action( ‘genesis_meta’, ‘sp_viewport_meta_tag’ );
function sp_viewport_meta_tag() {
echo ‘<meta name=”viewport” content=”width=device-width, initial-scale=1.0″/>’;
}

How to Make your WordPress Site Mobile Friendly - editing php file.jpg

2. I clicked “Activate” on the Jetpack’s “Mobile Theme” feature (lower right, in photo below).

How to Make your WordPress Site Mobile Friendly

The mobile version will now display if someone accesses my blog via a mobile device, but will not affect my normal theme’s look.  There are a couple of simple configurations you can play with (display feature photo or not, display excerpt or full article). But that’s it!

How to Make Your WordPress Site Mobile Friendly blog example

 

Taaa-daaah!!  This solution was so simple, I could weep with joy. It was downright comical after all I’ve been through trying to figure it out.

Mobile Friendly Test

You can use Google Developer’ s Mobile Friendly Test here to test out your site, by entering in your blog’s URL.

I hope this helps save someone time and unnecessary angst, in getting their site up to mobile friendly snuff!

*o*     *o*     *o*

Leave a comment

Your email address will not be published. Required fields are marked *

Prev Post

Family Travel in the Colorado Rockies

March 30, 2015

Next Post

Firmoo - Cute Frames, Low Prices [Coupon Code]

April 10, 2015