Add Facebook floating like button on blogger
.png)
Hi friends ! Today i am going to show you how to ad floating facebook like button on blogger.. its a very simple you just need to follow some steps :-
Step 1:-Open your blog and go to dashboard.
Step 2:-Go to templates and Edit template.
Step 3:-Now Find </head> by pressing CTRL+F and write there </head>
Step 4:-Just copy the code given bellow and paste it to the above code.
code:-<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
Step 5:-Now Go to your Layout option and click on add Gadget and then select HTML/JavaScript and copy the code given below and paste it in code section.
Code:-<!--Facebook Fans -->
<script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".abtlikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .abtlikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIup7-4e5ThOLLK_N1IY0qOvJ8KTkB1BSgb6aYXbvAz9UMmrtw9tJH2pGskDmCWlmomjs5K1RByxQZKLA63uIX5V0Tal3TCMTVAtWyfCNyRWycr6OLVuweG8lfXYH6LrhiG6pkfyRKm8CI/h120/button.png") 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%;} .abtlikebox div{ padding: 0; margin-right:-8px; border:4px solid #3b5998; background:#fafafa;} .abtlikebox span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} .abtlikebox span a{color: gray;text-decoration:none;} .abtlikebox span a:hover{text-decoration:underline;} } </style>
<div class="abtlikebox">
<div>
<iframe frameborder="0" scrolling="no" src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2FKnowledgeAndTrick&width=250&colorscheme=light&show_faces=true&border_color=white&connections=9&stream=false&header=false&height=245" style="background: ##2EFE2E; border: black; height: 275px; overflow: hidden; width: 245px;"></iframe>Widget by :<a href="http://www.trickdefined.blogspot.in/"> Knowledge And Trick</a> </div>
</div>
Step 6:-Replace the Facebook page name by your facebook page name Ex-- KnowledgeAndTrick
Step 7:- Save it.
Note :------------there are still other method which you can use ! ***
