Are you struggling to get more facebook likes? Add a floating facebook like box to your blog or website. The widget remains in a fixed position on the right-hand side of your site. When you hover over the blue facebook image, the like box will then slide and reveal itself. You can also add a Facebook Popup Like Box to your site or blog as well.
How to
- Add the following code anywhere in the body section <body> of your template.
<!--Floating Facebook Widget by http://blogsmasala.blogspot.com/ START--><script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".theblogwidgets").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .theblogwidgets{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1zqUqLOfeiJ4GGgMQtssrYlnbjTnlS1JYWDUPQfBAgIOgHk9I28U2NhtWnE7xHmZxcwctoSfdOd12bLw8aTdEKd5fXiUA2GULQZ3_ezNc94ZtDVDPpLUDYdyRC-2mmNLV-6Fkf6JtBd6S/") no-repeat scroll left center transparent !important; float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;} .theblogwidgets div{ padding: 0; margin-right:-8px; border:4px solid #3b5998; background:#fafafa;} .theblogwidgets span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} .theblogwidgets span a{color: gray;text-decoration:none;} .theblogwidgets span a:hover{text-decoration:underline;} } </style><!--Brought to you by http://blogsmasala.blogspot.com/-><div class="theblogwidgets" style=""><!--Brought to you by http://blogsmasala.blogspot.com/--><div><!-- http://www.theblogwidgets.com/2013/11/floating-facebook-like-box-widget-for.html--> <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fblogmasala&width=245&colorscheme=light&show_faces=true&border_color=white&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;color:000;"><!--Brought to you by www.TheBlogWidgets.com--></iframe><!--Brought to you by http://blogsmasala.blogspot.com/--><span><!--Brought to you by http://blogsmasala.blogspot.com/--><center><a rel="nofollow" style="color:#a8a8a8;font-size:8px;" href="http://blogsmasala.blogspot.com/">BlogsMasala</a> - <a style="color:#a8a8a8;font-size:8px;" href="http://blogsmasala.blogspot.com"></a></center></span></div></div>
- If the floating facbook widget is not working properly after step 1, then you need to add jquery to your site. Follow the instructions below.
- Go to Design>Edit HTML
- Search for <head> and just below it paste the following JQuery code.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>How to Customize
- Go to the blogger dashboard>Layout. Click "edit" on the "HTML/Javascript" gadget.
Replace blogsmasala with your own facebook page username. If you don't have a username you can easily create your own here.
Post a Comment Blogger Facebook
Please Do not Spam. Give us Positive feedback to make this blog more better.
EmoticonClick to see the code!
To insert emoticon you must added at least one space before the code.