Install Sidebar Floating Facebook Like Box Widget In Blogger - Gourab Design

Install Sidebar Floating Facebook Like Box Widget In Blogger


Friends, we will tell you today about a best javascript. You probably will not know about this. Because this is a brand new formula.And I made it adjusting according to my own accord. So I want you all to know about it. Todays article we are discussing Install Sidebar Floating Facebook Like Box Widget In Blogger .

Sidebar Floating Fb Like Box Widget

If you have a website then you have a website. So you will know how much traffic is possible for any blog. If the visitor will not be So there is no point in running the website. And if you do not even know how to rank your blog? So I'll help you.

Friends Social Media is a platform that can bring you much traffic on your site. You may not know its way. If you do not know then do not worry because I will tell you about it. Facebook is the most popular in social media.

From where you can get a lot of visitors. That too easily You are wondering why I am saying this. Because I use this technique myself. Who is sharing with you. So let's come to the topic now.

Popular Post Widget With Auto Numbering And Thumbnail

Sidebar Floating Fb Like Box For Blogspot

Today I will give information about script With which you can increase payloads on your Fan Page. And you can get a lot of readers. And it's such a nice design that this widget will show in floating in the right side of your site. .

In this guide, I will show you how to how to add facebook like box in blogger. Everyone wants another and interesting facebook like box widget for blogger for their blog, such as the boxing widgets for blogspot. Example: popup  (if you're interested in adding flat facebook like box widget in blogspot,  In my opinion, this is the best for you.

GOURAB DESIGN still publishes various and interesting search engine optimization tips. We always share attractive and beautiful themes , gadget also tips and tricks. So, floating fb like button

 another kind of my choice. This is fully customizable as a with CSS.

Facebook Gadget for Blogger

To put this, I am going to say a very simple step, follow it.

  • STEP 1:

✓ first you visit

• Now click the template option.

•  edit html

• Now see opened a code box. Press the ctrl+f .

• search <head> tag.

• now copy below jQuery and paste after the <head> tag.

  • ✓ STEP 2 : 

 <script src='//' type='text/javascript'/> 

• again search </body> tag.

• now copy below code and paste above this tag.

<div id='fb-root'/>
<script type='text/javascript'>
window.fbAsyncInit = function() {
appId : '1742254676101522', // replace with your app id
status : true, // check login status
cookie : true, // enable cookies 
xfbml : true // parse XFBML
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//';
e.async = true;

 > Save template.

Floating Fb Box For Blogs

  • STEP 3:

• Back to admin panel.

• click the layout option.

• touch the Add a gadget anywhere.


• Copy below js and paste in this box.

<script type="text/javascript"> 
$(document).ready(function() {$(".fgdslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);}); 
<style type="text/css"> 
.gdfslikebox{background: url("") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;} 
.gdfslikebox div{border:none;position:relative;display:block;} 
.gdfslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} 
.gdfslikebox span a{color: #808080;text-decoration:none;} 
.gdfslikebox span a:hover{text-decoration:underline;} 
</style><div class="gdfslikebox"><div>
<iframe src=";width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0"  style="border:4px solid rgb(53, 102, 203); overflow: hidden; height: 266px; width: 240px;background:#fff;"></iframe></div></div> 


[ pyarmeindia change it with your page user name ]

Save this engagement.


 Visit your site. And see the result...........

If you have any problems then please share it with me. I will help you immediately. If you get any benefit from this post, please share it. So that everyone can take advantage of it. By now take care of yourself.

No comments