OscarminiOscarmini
  • Home
  • Reviews
  • Gadgets
  • Computers
  • How Tos
  • Travel & Lifestyle
  • Phone ROMs
  • Contact us
    • Advertise
    • About Us
Facebook Twitter Instagram
  • Home
  • Reviews
  • Gadgets
  • Computers
  • How Tos
  • Travel & Lifestyle
  • Phone ROMs
  • Contact us
    • Advertise
    • About Us
Facebook Twitter Instagram
Oscarmini Oscarmini
Subscribe
  • Home
  • Reviews
  • Gadgets
  • Computers
  • How Tos
  • Travel & Lifestyle
  • Phone ROMs
  • Contact us
    • Advertise
    • About Us
OscarminiOscarmini
Home»Tip»How to add facebook floating like button on blogger

How to add facebook floating like button on blogger

Isaac FrankBy Isaac Frank2 Mins Read
Facebook Twitter WhatsApp LinkedIn Email
Share
Facebook Twitter LinkedIn WhatsApp Pinterest Email
Facebook is one of the leading social networks and a means by which many bloggers drive traffic to their blogs. Adding a facebook page like button on your blog can help you get many fans to your facebook fan page.

This tutorial will teach you how to ad a facebook Floating Like widget on your blogger blog. example on the photo below:

Follow the below steps to implement this on your blogger blog…

1. Goto your blogger dashboard

2. Select the blog you want to add it to and navigate to ‘Templates’

3. Click EDIT HTML and then press CTRL F to find the below code
</head>

4. Just above the code above, add the below codes

<script src=’https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js’ type=’text/javascript’/>

Some Templates already have the below code. so just make sure yours doesnt have it before implementing it.

5. Now goto Layout > Add Gadget > HTML/Javascript, then put the below code in it.

<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(“http://4.bp.blogspot.com/-mMtB2ANqowQ/T6es-PuSR2I/AAAAAAAAAjM/LDamrUnMJJc/s320/fb1-right.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%2Fetechjournal&width=245&colorscheme=light&show_faces=true&border_color=white&connections=9&stream=false&header=false&height=270″ style=”background: #fafafa; border: white; height: 270px; overflow: hidden; width: 245px;”></iframe>Widget by :<a href=”http://www.etechvilla.com.com/”> The eTech Journal</a> </div>
</div>

6. Save

Customization: Chance etechjournal in the above code to your facebook page usename.

#Conclusion: Over To You Boss!!! What do you think About this Post?? Do you have further clearifications? Feedbacks? Suggestions? Or Inquiry? Why Not Use The comment Box To Communicate With Us? We will be Happy If you Do.

blogger Blogger Widgets
Share. Facebook Twitter Pinterest LinkedIn Tumblr Email
Isaac Frank
  • Website

I'm a writer, blogger, tech enthusiast and simply a Geek!

Related Posts

How To Delete a Blog From Your Blogger Dashboard

March 3, 2015

How To Merge 2 or More Blogger Blogs – Multiple Blogs into 1

March 2, 2015

How To Embed & Resize A Youtube Video In Your Blog Post

February 11, 2015
Add A Comment

Comments are closed.

Latest Posts

5 Best Smart Helmets In 2022

July 5, 2022

5 Best Crypto Gadgets In 2022

July 5, 2022

Moove, a Nigerian Mobility Fintech Startup Raises N12bn

July 5, 2022

5 Best Lighting For Creatives In 2022

July 4, 2022
Oscarmini
Facebook Twitter Instagram YouTube
© 2022 Oscarmini Co. Designed by illBytes.

Type above and press Enter to search. Press Esc to cancel.