Make A Mobile Friendly Blog / Website

Read (
Words) Edit

Make A Mobile Friendly Blog / Website





Nowadays, millions and millions of people are using mobile devices to access internet. If you don't make your blogs compatible with mobile devices. You may lose all your mobile readers. A normal blog takes a lot of time to load and, the size of your blog is too big for a mobile device. Thus, we have to make another version of your blog for mobile readers.  Luckily, with Blogger/Blogspot platform, you can achieve this with ease. The following instruction will show you how to do it.

  1. Login to your account --> Design --> Edit HTML

  2. Search for
<head>

  1. Copy and paste the following code right after the <head> tag
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
    <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=2.0' name='viewport'/>
<b:else/>
    <meta content='width=1100' name='viewport'/>
</b:if>

  1. Check that the next immediate line is
    <b:include data='blog' name='all-head-content'/>

  2. Save your template and you are done



By Shiro, at http://www.blogsmonetize.com/2010/11/make-your-blog-ready-for-mobile-device.html


He's also the author of http://www.blogsmonetize.com/2010/11/add-facebook-like-button-to-blogger.html , http://www.blogsmonetize.com/2010/11/title-and-url-seo-friendly-for-blogger.html , http://www.blogsmonetize.com/2010/11/what-is-meta-tag-in-html-or-xhtml.html , http://www.blogsmonetize.com/2010/11/how-to-add-twitter-to-your-blog.html


Really useful stuff!


.....




With a website, just add the following line of code after the <head> tag: 



<meta content=”width=Device-width; initial-scale=1.0;maximum-Scale=1.0; user-scalable=0; “/>





.....

CONVERSATION