Shiny Facebook floating likebox for blogger l Tricks Gack

This is my first blogger widget.As we all know that Blogging is the new trend for young students and ever professionals.Everyone is struggling to get more and more facebook likes on their blog page.They share their blog on facebook and other social networks to get more likes.Today i am going to share a stylish and shiny facebook floating widget for blogger.By putting this widget on your blog you can get more likes.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 using jquery.Let's start follow me carefully.

Demo

First of all Login to your blogger account.
Goto your blog layout.
Click on Add a widget.
Select HTML/Javascript widget.
Paste the following code in the HTML/Javascript box.

<script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".tglikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .tglikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUut4eCVvM3H_Bb1knsZl17wE9Ceqlzq26sLY_B1Ykacbc1nAcAzegvU52xzwtyHvZBmHZv6lObMpn0cTSb5AAd0XpXPgUNaMAZXdtnXXULl5Cx2qnaSVXsiTyUCCorGYZbnzIixek8dw/s1600/fb+badge.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%;} .tglikebox div{ padding: 0; margin-right:-8px; border:4px solid  #3b5998; background:#fafafa;} .tglikebox span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} .tglikebox span a{color: gray;text-decoration:none;} .tglikebox span a:hover{text-decoration:underline;} } </style> <div class="tglikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Ftricksgack&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;border_color=white&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;"></iframe><span>Widget by:<a href="http://www.tricksgack.blogspot.com">Tricks Gack</a></span></div></div>

Now find Tricksgack and replace with your facebook page username.
Click on Save option.
Goto Template>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'/>

About Mohsin Ali

I am Mohsin Ali From Rahim Yar Khan,Pakistan.I am a Web Designer,Graphic and Web Developer and also a Blogger.I'm student of class 1st year.I love Blogging.I spend 2 hour's on internet to explore the latest technology news.

5 comments

Click here for comments

collegiatebd

admin

11 June 2014 at 00:36 ×

Thank you brother. It is working. I've applied it. If u choose http://collegiatebd.blogspot.com/

Mohsin Ali

11 June 2014 at 07:25 ×

Thanks dear for visiting my blog i hope if you keep visiting you will find best stuff for blogger

26 August 2014 at 02:12 ×

Dear, I've visited more than 100 sites to set a floating like box in my blog http://collegiatebd.blogspot.com. But is a great regret that I had failed several times. But only your trick have been worked perfectly. I am very proud and happy to your work. The number of posts you have published is not huge but these are not fake rather they work perfectly. That is very necessary to keep in mind every blogger/publisher. Thanks for your hard, unique, perfect and true work. Go ahead.....

26 August 2014 at 02:26 ×

Dear, please publish/create a post on how to customize Tabs. In it, please show how to set sub tabs just like your blog tab. As for example it can b said that tab section in your blog, there are 3 tabs under Blogger Tab. These are Wigets, Templates, SEO tabs etc. How can it be set?

devidmiller5060

7 March 2015 at 05:00 ×

Yes, great US Military force. Also, in his post you have given a chance to listen about US Military. I really appreciate your work. Thanks for sharing it.
Buy Facebook Likes Cheap

Do not post any link in the comment which is of another site.
Do not use bad wording.
Keep the rights and rules of the site ConversionConversion EmoticonEmoticon

Thanks for your comment

Tricks Gack

Shiny Facebook floating likebox for blogger

About Mohsin Ali

Related Post

5 comments