Latest News

Facebook Slide Out Share Button for Blogger


Now a days Facebook share button is very important to increase your blog traffic as well getting touch with your blog reader. So, here i am providing you a Facebook Silde out share button for blogger.
This widget has many features such as -
  • Lightweight Size
  • Compact Design
  • Supports all Major Browsers
  • Attractive and Elegant
  • Made with CSS3 and beautiful transitions.
  • Shown only on Post pages
Code :

<b:if cond='data:blog.pageType == "item"'>
<style>
/* Widget by geekyshows.com */
#fixed-share {background: none repeat scroll 0 0 #4C6699;border-bottom: 3px solid #30476F;bottom: 60px;box-shadow: 0 8px 8px #888888;font-family: Arial;font-size: 16px;padding: 15px 30px 15px 15px;position: fixed;right: -147px;text-align: left;text-transform: uppercase;transition: all 1s ease 0s;z-index: 10;}
#fixed-share:hover {right: 0}
#fixed-share:hover > #share-box {right: 147px}
#share-box {background: none repeat scroll 0 0 #4C6699;bottom: 72px;box-shadow: 0 8px 8px #888888;height: 40px;position: fixed;right: 1px;text-align: center;transition: all 1s ease 0s;width: 40px;}
</style>
 <div id="fixed-share">
 <div id="share-box">
<img src="http://s10.postimg.org/s1a8ghl6t/Fb_Logo.png" />
</div>
<span>Support Us<br/> <script>(function(d){ var js, id =
'facebook-jssdk'; if (d.getElementById(id)) {return;} js =
d.createElement('script'); js.id = id; js.async = true; js.src =
"//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>  <fb:share-button expr:href='data:post.url'
type='button_count'/> </fb:share-button>
</span></div>
<!-- Widget  by geekyshows.com -->
</b:if>

How to Do :
1. Copy above code
2. Login to your blogger and click on Layout then click on Add a Gadget

3. After Clicking on 'Add a Gadget' A window will appear then Click 'HTML/Java Script'

4. Soon a Configure HTML/Java Script window will appear. There you need to paste the code and Click on Save.

5. Done !


Like it ? Share it.

No comments:

Post a Comment

Contact Us

24x7 online , we happy to answer you
tamilcypc@gmail.com

Disclaimer

This Blog and its TUT's are intended for educational purposes only, no-one involved in the creation of this TuT may be held responsible for any illegal acts brought about by this Blog or TuT.



Featured Post

Custom Domains And HTTPS Redirection Code