Facebook Like/Fan Box For Blogger

This tutorial is for everyone who has already created a Facebook Fan Page. If have not created one, try making one. A Fan Box or Like Box allows your Blog visitors to like your facebook fan page, without leaving your blog. It can also display faces of the “likers” on your blog. To add the fanbox to blogger, follow these steps:
1. Find out your Facebook Fan Page URL. To do that, just visit your Facebook Fan Page, and copy the url in the address bar.

In my case it is http://www.facebook.com/bloggerplugins (The url which you see in the address bar when you visit your fanpage.) .Copy this url from your address bar.
2. Visit This page http://developers.facebook.com/docs/reference/plugins/like-box
You have already copied the facebook fan page url. Paste this into the Facebook Page URL field

Select the choices appropriately and you can see a live preview of the Like/Fan box.
3.Once you are satisfied with the looks of the Like Box, Click on the “Get Code” button
4. Copy the iframe code which gets generated.

5. Now login to your Blogger account and go to Design > Page Elements
Click Add a Gadget Link and Add an HTML/JavaScript Gadget

6.Paste the generated code as the Gadget’s Content

and Save the Gadget.
Now you should see the Fan/Like Box on your blog’s sidebar.

Another variation

If you need a simpler Like button, without any extra decorations, then visit http://developers.facebook.com/docs/reference/plugins/like . In the code generator, paste your Facebook Fan Page’s url as the URL to Like and follow steps 3 to 5. Now you will get a simpler Like Button with count.

More about → Facebook Like/Fan Box For Blogger

How To Compatible Blogger Blog With Mobile Phones

If you are using a Blogger Layout Template,this tutorial will helpful for you.But if your template is a blogger template,created by using Blogger Template Designer, usually this feature has already added to your template.This will really helpful to increase the number of mobile visitors of your blog.

Now follow the simple steps given below to ready your blogger blog for mobile phones.

1.Login to your blogger Dashboard--> Design- -> Edit HTML

2.Scroll down to where you see below code:

<b:include data='blog' name='all-head-content'/>

3.Now copy below code and paste it just before the above line.

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>

4.Now save your template and you are done.

More about → How To Compatible Blogger Blog With Mobile Phones