How To Make Your Website Mobile-Friendly In The Next 5 Minutes

Google has announced that as of April 21st its search algorithm will value mobile friendly websites at a higher value than ever before. The massive change is going to affect websites more than previous changes such as Panda and Penguin. They’re implementing this in order to create the best user experience possible now that the user experience is even more on the go than ever before.

1. Back Up Your Site

Before ensuring your site is moved over to a mobile friendly version, be sure to back up your content on your site before making any huge changes. If you’re not certain on how to backup your site, check out this guide by WordPress in order to do it properly.

If your site is hosted on WordPress, then you’re in luck! WordPress has many themes that automatically configured your site to be mobile friendly. This does, however, depend on your theme that is currently installed as well as the platform of the user. For additional information, check out WordPress’ Mobile Theme Support Page.

If your site is set up with your own domain and web hosting service,, you’ll need to do some configuring in order to be sure your site is mobile-friendly. Luckily, the hosting provider we suggest has incredible support for configuring this properly. Check them out at HostGator.com and get started right away.

2. Check Which Version of WordPress You are Currently Using

There are 3 different ways you can identify which version of WordPress you currently have installed. The first option is the easiest and requires the least amount of experience, but there are other options as well to consider.

2.1. Administration Panel

Navigate to your administration panel and identify which version of WordPress you have installed. For older versions, the number may appear towards the bottom of your dashboard, but for newer versions, the version number appears near the top.

2.2. View Source Data

Go to your website and view your websites source data in order to search for the generator meta tag. You can do this by opening up opening up your website in a browser such as Google Chrome, right clicking an empty area of your page and clicking on the “View Source” option. You can then search for the meta name which will appear similar to the following:

<meta name=”generator” content=’WordPress 3.9.2” />

2.3. Locate The File

The version number can also be found in a text editor when locating the file /wp-includes/version.php. If the file is on a remote server, FTP programs can allow you to see the remote text files.

If any of this confused you, you can check out more information on identifying your WordPress version by following the WordPress Installation FAQs Guide.

3. Update Your WordPress Theme

Ensure that your theme is up to date by navigating to your Appearance tab and clicking on Themes. If there is an update available for your specific theme, be sure to update your theme to the latest version. This alone may solve the problem.

4. Run The Test

Check your URL with the mobile friendly test tool over at Google Developers.

If your results look like the following image, then congratulations! You’re done!

image

However, if the test came back as negative and did not solve your problem, then you’ll need to convert your site to a mobile-friendly version. This can be done a couple of ways.

5. Convert Your Site to A Responsive Design

5.1. Change your theme to one that is updated with responsive design.

With an updated responsive design theme, your website will now have capabilities that supports mobile. If you are shopping for a new theme anyhow, be sure to check out the live demo of that theme on both the desktop and mobile versions. You will be able to get a taste as to what the theme is capable of doing for both platforms.

If you do not have access to a mobile device in order to test your theme, you can try a simple test by narrowing your desktop window to a smaller size. This imitates a responsive design in that the site should begin moving items around as you shrink the page rather than begin cutting off text and not resizing images etc.  This is not a foolproof test, however, so it may be smart to test it on a friend’s mobile device if you are able to.

5.2. Use Plugins 

If you wish to keep your current theme you may consider numerous plugins includingJetpack, WPTouch and WP Mobile Detector.

5.3. Advanced HTML Coding

Lastly, you are able to make your site mobile-friendly by means of advanced coding experience with HTML and CSS knowledge. To begin this process you can check out these resources to find a place to begin:

WordPress Theme Development

Google Developer Fundamentals

6. Final Check

Head on over to the Google Developers’ Mobile-Friendly Test and run the test again. Paste your site’s URL in the analyze bar in order to see your score. If you’re still finding unsatisfactory results consider the google developers forums or the WordPress support forums for additional guidance.

You can also head to the Google Developers’ Mobile Guide for more information.

And while you’re at it, Check out their Page Speed Insights Tool over at google developers for a quick speed test analysis of your page. This will also be a clear analysis for possible improvements to your site in the future.

For even more quick-step guides and best WordPress practices, head over toWebsitesMadeEasy.tv. Here you’ll find in-depth guides and video tutorial walk-throughs for building your website. Be sure to also follow our community over on our Facebook page and YouTube channel.


10 thoughts on “How To Make Your Website Mobile-Friendly In The Next 5 Minutes”

Leave a Reply

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