Tutorial on Creating a Customized Mobile Site For Your Blog

Some hosting companies do allow you to enhance freely in your main website template, but it don’t have that many features in their Mobile Templates. Recently, lot of people prefers using mobile phones to browse, so it’s getting extremely essential to optimize your website for mobile users. If the ratio of your mobile users is superior to your desktop users, then you have to develop a mobile responsive template for your Blog this will not only increase your reliability, but your main mobile audience could take breath effortlessly with your friendly mobile template.

This tutorial is absolutely simple.You need just 20 minutes to design a perfect mobile responsive template for your blog. Moreover, you don’t need to learn HTML, CSS or JavaScript coding to design a Mobile-friendly template for your blog because with the help of a platform called GOMO an initiative of Google, you can easily carry out the design without stress.

Step 1: Get Started.

First, logging to http://www.howtogomo.com and scroll down to a picture which says “CREATE YOUR MOBILE SITE NOW”. Select it and move to the next step.

Step 2: Test your Website.

Then you have to enter your website/blog URL for system to easily detect the data which is currently hosted at your blog. After entering your complete URL along with  press the green button which says “MAKE MY SITE MOBILE”.

Step 3: Select the Type of your Site.

Automatically, the system will detect whether your site is a website or a Blog. Further select  Website/Blog Templates of your choice.

Step 4: Choose a Flawless Mobile Theme.

You can Choose any Templates as your mobile theme category, after which you will witness an enormous list of themes, now you can select any theme that has the potentials to amuse your mobile readers. Additionally, with the help of interactive preview you can apply a theme and can examine how it will appear to your mobile users.  

To select a theme for your mobile-friendly website just double click on any template and it will be applied to your interactive live preview. The interactive preview allows you to test your mobile theme directly from your desktop. You can navigate through different pages and can test out each and every feature from top to bottom.

Now after testing out your theme on live preview it’s time to customize the color scheme of your mobile theme, so it looks identical to your Desktop version website Press next and move ahead. 

Step 5: Customize Your Mobile-Friendly Theme.

  A new interface will appear from where you can customize your theme from header to footer without any hesitancy whatsoever. Just Press the “Full” tab present at the top and you will be able to see a list of thing which you can do with your mobile theme i.e. Edit Header & Logo, Edit Blog Homepage, Edit Blog Posts Style, Edit Blog Comment Style, Edit Footer and Much more.

• Edit Header & Logo: When you will select “Header & Logo” tool a new widow will pop out from where you can customize your header or logo. You can either use Image Logo or can use Text based logo according to your needs.

• Blog Homepage: If you want to change your background color or you want your customized background image then you can use this tool and can make your mobile theme more powerful in designing.

• Blog Post: Using this tool you can change font size, background color, the color of your main post heading and much more.

• Blog Comments: If you don’t have an interactive commenting system your visitors will never leave a comment so this tool will allow you to customize your comment style. You can change color, add avatar and much more.

• Footer: As we all know Footer is the place where we give credits to the developer of the website so you can use it for that purpose. However, you can also use it to increase your width and height and much more.

Now After customizing your theme according to your needs go ahead and press Next button and you are almost done!

Step 6: Register Your Free Account.

Now enter your email address along with your password to register your Free account and Press Save My Site button to move to the next step.

Step 7: Redirecting Your OLD Mobile Site To New Mobile Friendly Site.

You will be provided with the link where you can preview your mobile site with different mobile operating system i.e. Android, iPhone, Windows Mobile and Blackberry. Now Scroll down and you will see a button which says “SETUP MY MOBILE WEBSITE REDIRECT” just press it and move to the next step.

• Then Go to Blogger.com >> Template >> Edit HTML >> Proceed
• Now Search For <head> and just below it paste the code which you copied earlier and then save your Template.

That’s it your Customized mobile template is implemented to your blog. Now Go and enjoy playing with your mobile website on your Smartphones. 

If you want to edit your Mobile Theme you can customize or do any changes any time you like by signing into your account at http://gomo.dudamobile.com