Today i m going to share something more interesting about facebook. Which have trillions of users through out the world. So many friends have facebook fan pages through which they promoted their business. If they have blogs and add facebook like box in their blog than they will increase their likes as well. So i m share a new widget of facebook with my friends which names is Floating Facebook Likebox. It is an excellent slider in which Likebox hidden inside. It will appears when visitors put a mouse cursor on it a facebook like box will appears.
Click on the below button to see the live demo of floating facebook likebox.
How to add a Floating Likebox
- Login to blogger.com
- Goto layout click on Add a Gadget
- Select HTML/JavaScript
- Paste the below code inside it.
<script type="text/javascript">//<!--$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});//--></script><style type="text/css">.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYMJiE9adQg3RhV4oq9RXAZQoIHGovVooCyryFUj9VJ-j0mpF0TInpIbx18eVUhEUUozWfzTvv2fORqhpfSR8baXaAvzYAzN_jOQ9RbeGRffnK0oBgaDLK07L4KL7gmNmVKxnE2j8Isso9/s150/w2b_facebookbadge.pn") 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%;}.w2bslikebox div{border:none;position:relative;display:block;}.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}.w2bslikebox span a{color: #808080;text-decoration:none;}.w2bslikebox span a:hover{text-decoration:underline;}</style><div class="w2bslikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Ftruebloggingtricks&width=245&colorscheme=light&show_faces=true& connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>Widget by:<a href="http://truebloggingtricks.blogspot.com/">True Blogging Tricks</a></span></div></div>
- Replce truebloggingtricks with your facebook fan page username.
- Save your widget
- Then goto template click on EDIT HTML and search <head> and below it paste the following code.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
- Save you template and done.
Tidak ada komentar:
Posting Komentar