FREE SPEED AUDIT
FREE SPEED AUDIT

Make Any WordPress Site Mobile Friendly

written by WP Fix It

March 21, 2017

Make Any WordPress Site Mobile Friendly in 6 steps and less than 30 minutes, our Founder Jarrett Gucci will show you how to take any WordPress site and make a mobile version of it that will load on all smart phones. There are 2 main reasons why this walk through is useful. The 1st one is if you currently have a theme that is not mobile friendly which creates a bad viewing experience when on a smart phone. The other reason would be if you have a responsive site but want more control over how it looks on all mobile phones.


Here are the magic ingredients and steps below.

2 Required Plugins:
Theme Test Drive
https://wordpress.org/plugins/theme-test-drive/

Mobile Smart
https://wordpress.org/plugins/mobile-smart/

Option Pluign:
Mobile Smart Pro ($13)
http://codecanyon.net/item/mobile-smart-pro/3671362


Step #1

Select a mobile theme to use when viewing site on smart phone. Install it. Make sure what ever theme you choose allows for you to put custom CSS code directly into thetheme options.

My favorite for non-Ecommerce is Responsive Theme by Cyber Chimps
http://cyberchimps.com/responsive-theme/

My favorite for ecommerce using woocommerce is Mystile by WOO themes.
http://www.woothemes.com/products/mystile/


Step#2

Install Theme Test Drive and Mobile Smart or Mobile Smart Pro plugins.


Step#3

Enable Theme Test Drive theme you want to use for mobile viewing in order to adjust theme settings.


Step #4

Setup mobile menu and widgets for mobile theme. While you are in theme test drive mode and logged into your admin area, view the site and adjust CSS styling as desired.


Step #5

Visit Mobile Smart settings and adjust as desired. Select the them you want to use when site is viewed on a mobile phone.

Optional: (if using Mobile Smart Pro plugin) Visit any page or post and edit the mobile version of the content.


Step#6

Disable Theme Test Drive and you are ready to roll.

 

WordPress Speed Up Service

You May Also Like…

22 Comments

  1. Beth

    Great tip! i am wondering though, how does this affect site speed etc? I have seen many WP dev’s advise against using plugins for things. Personally prefer that same approach, so coding responsiveness seems like a much better option. Or am I seeing that wrong? 

    Reply
    • WP Fix It Support

      Great question Beth! Plugins do affect speed but not all affect it enough to make a difference. The only plugin this walk through requires is Mobile Smart which simply switches the theme display if site is being viewed on a mobile phone. There is no speed sucker with this plugin.

      It is always great to have responsive built into the site, but not all can do that and also this technique I explained, gives you way more control over how your site looks on mobile even if you desktop site is already responsive.

      Let me know if any of this does not make sense. Thanks!

      Reply
  2. Anne

    Super helpful and worked as described! Thank you!

    Reply
  3. Corinna Tannian

    Hi thanks for this, I notice though that you cannot change text and background colours on menu bars, headings etc. Would this only be available in Pro with the Responsive theme that you recommend?

    Reply
  4. Lori

    When I activated the plugin I got a message saying a few more were needed. One was for security, called Claf. Do you recall that happening when you put the plugins you recommended?
    Also if you could clarify, only I see what is happening when I view the page I am making mobile, correct?

    Reply
    • WP Fix It Support

      Clef is not needed for this to work. Can you please clarify where you are stuck here?

      Reply
  5. Arly

    Hi,

    I made it to the part where you selected the ‘Theme Options’ from the ‘Appearance menu’. I don’t have a ‘Theme Options.’ How do I get a ‘Theme Options’ tab?

    Thanks!

    Reply
  6. Darryl

    What is cost to have a responsive plugin added to this site?

    Reply
  7. Rod

    Great tutorial! This is solid gold for my business. I would however like to know how you got the iphone viewer used in this video. I’ve just been using the one in the WP Customize area, but this would be much better if you don’t mind sharing where or how I can get one.

    Reply
  8. Paul Guzman

    As of this comment the plugin says it is “Untested with your version of WordPress”. The plugin was last updated over a year ago. When will it be updated? Or is this plugin on the way out?

    Reply
    • WP Fix It Support

      Impossible to know for sure. Would need to ask the plugin developer.

      Reply
  9. indtens

    great tutorial! but can I choose which plugin runs on mobile or desktop version.

    Reply
  10. Lawrence

    HI im having the same issue that you had in the video with “You do not have sufficient permissions to access this page” ive definitely localised this problem to when i activated theme test drive, how did you fix this problem ? thanks

    Reply
    • WP Fix It

      Look in the menu on our website and click on “FIX MY SITE” after that scroll down below the video and select General Support for immediate attention.

      Reply
  11. Clash

    I want to buy this plugin so please talk me it will work on v5.3.2??

    Reply
    • WP Fix It

      You need to ask the plugin company. We wrote this post years ago.

      Reply

Submit a Comment

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

LET US GET STARTED RIGHT AWAY

READY TO GET YOUR SITE FIXED