Home » Blogger Tutorials » How To Add Facebook Like Box To Website | Blogger Blog
Monday, June 24, 2013
How To Add Facebook Like Box To Website | Blogger Blog
In my previous post, I was discussed some easy steps on how to create a facebook page for your website.
Today, I am going to tell you, how you can add a facebook page like box
into your website or blogger blog easily. This small box is a great
widget for bloggers which is used to promote your fan page. Having a fan
page like box into your blog sidebar is a great practice to convert
your visitors into loyal readers just by clicking the like button. So,
let see how to add facebook page like box.
Add Facebook Page Like Box To Blogger
1) Log in to your blogger account.2) Click on blog title in which you want to add a like box.
3) Go to layout and then click on Add a Gadget.
4) Select Html/JavaScript and paste the entire code given below in it.
5) Replace facebook page URL with your own page URL.<style> .DHIbloggerFB { width: 280px; height: 150px; border-radius: 3px; position: relative; background-color:#f4f4f4; padding:5px 10px 15px 0; } .DHIbloggerFB, .DHIbloggerFB:before, .DHIbloggerFB:after { background: #f4f4f4; border: 1px solid #ccc; } .DHIbloggerFB:before, .DHIbloggerFB:after { content: ""; position: absolute; bottom: -3px; left: 2px; right: 2px; height: 1px; border-top: none; } .DHIbloggerFB:after { left: 4px; right: 4px; bottom: -5px; box-shadow: 0 0 2px #ccc; } </style> <div class="DHIbloggerFB"> <div style="height:155px;overflow:hidden"> <fb:like-box href="https://www.facebook.com/hubhacker" data-width="300" data-height="179" data-show-faces="true" data-border-color="#f4f4f4" data-stream="false" data-header="false" class=" fb_iframe_widget "><span><iframe id="f5741c08" name="fdd6ca2ec" scrolling="no" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; border-image: initial; overflow-x: hidden; overflow-y: hidden; height: 179px; width: 300px; " class="fb_ltr" src="http://www.facebook.com/plugins/likebox.php?border_color=%23f4f4f4&channel=https%3A%2F%2Fs-static.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df2babfba84%26origin%3Dhttp%253A%252F%252Fwww.btsnts.com%252Ff1ae6f85bc%26relation%3Dparent.parent%26transport%3Dpostmessage&colorscheme=light&header=false&height=179&href=https%3A%2F%2Fwww.facebook.com%2Fhubhacker&locale=en_US&sdk=joey&show_faces=true&stream=false&width=300"></iframe></span></fb:like-box> </div> </div>
6) Change width and height according to your blog template and save the gadget.
7) Done!
This is all about creating and adding a facebook page like box into your blogger blog. You should include this great widget into your blog which really helps you to increase your page likes that converts your regular visitors into your page fans. Whenever you update your page with the latest blog post, your fan page will let your fans to come to your blog and read the latest updates. And the great thing is that you will receive free traffic for your blog. Hope you like this tutorial.
Subscribe via Email
Author: Jatin SIngh
Jatin Singh is a student of Information Technology. He is addicted web designer, he do like Ethical Hacking and He loves Hacking, Blogging, Exploiting. He have started blogging in 2011 and i have one blog named Cyberhax. Join Me On Google+













