How To Add Hover Pin It Button On Blogger Images

Hello Bloggers, in the last post we discussed how one can add drop down navigation menu to the upper blogger tabs so that to save space and make your blog homepage attractive.Today I am going to share the tutorial about adding Pinterest hover button to every image you add to blogger. You know what is the value of social networking sites to boost traffic to your blog. You can get powerful visitors and a strong backlink from Pinterest if you add this button to your blog.So I have made this tutorial, let us turn towards it..

Image Source: Pinterest.com

Steps To Add Pin It Hover Pin Button To Blogger:

• Log in to Blogger
• Go to Template >> Edit HTML
• Click on template box to activate it
• Now press ctrl+F and search for following code:

</body> 

• Now paste the following code just about this one: 

 <script>   //<![CDATA[   var bs_pinButtonURL = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzCCrH7IQ9O-jalaNceRZEqEH_owW378K9NxkKy4Ec08YeSuolXYM_ejy3Go_5BD75_VAZfHLPBEZICKhD34kaDuvXtssWp_zsEeJcBF4Sjo0oE9m63ju7Y6_6U5vmwxuNZoQT5pv3CwbH/s1600/pinterestx1_72.png";   var bs_pinButtonPos = "center";   var bs_pinPrefix = "";   var bs_pinSuffix = "";   //]]>   </script>   <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>   <script id='bs_pinOnHover' src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'>   // This Pinterest Hover Button is brought to you by bloggersentral.com.   // Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.   // Feel free to use and share, but please keep this notice intact.   </script>  

•  Save the template and you are done.

Customization:

1) To Change Position, Change Center (Green) To -

• Top Left
• Top Right
• Bottom Left
• Bottom Right

2) Want for specific images ??

If you do not want this button for a image in specific post, turn to HTML mode and find this code using ctrl+F:

<img

and paste following one after this: 

class='nopin'

That's it  you have successfully added pin it hover button to images on your bloggers blog. Now you can drive a huge traffic from pinterest to your blog. If you have any problems you can leave a comment below. Happy Blogging..!

Content Worth A Share ?

• Facebook
• Twitter
• Google+
• Pinterest
• StumbleUpon
• Dig
• LinkedIn

Written by Unknown

Satyam Bora Is 18 Years Old Boy Addicted To Blogging And Technology.He Is A Part Time Blogger And Student Of Civil Engineering. This Guy Is Always Here To Help You :)