Pinterest Button on Image Hover

How to i add Pinterest Button on Image Hover

No HTML is required for hoverbuttons; all you have to do is load the JavaScript listed below. Once you have this installed, images should show a Pin It button when hovered over. (If you're already running pinit.js, just add the data-pin-hover="true" attribute to the existing SCRIPT tag.)


1. Go to your blogger dashboard>>Template>> Edit HTML
2. and find the following code in your template code.

</body>

3. and put it just above your closing </BODY> tag. (provided by pinterst).
4. Click on save button and you're done..!!!Live DEMO HERE

<script type="text/javascript" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>

Note:- If you are already using pinterest pin it button then just add following attribute code in pinterest script tag.

data-pin-hover="ture"

You can see complete script above in step 3.
Note:- If you're not already running pinit.js on your page, please visit the Widget Builder to find out more about the Pin It button and the rest of Pinterest's fleet of handy widgets.Lear more about Display post author, date, labels and comments with icons below post titles

Some Images Won't Work with the following reasons.

CSSbackground images, images that are under 80 by 80 pixels in size, images that have the data-pin-no-hover="true" attribute set, images that have the nopin="nopin" attribute set, and images whose SRC attribute starts with data: won't show hover buttons.
You can definitely still use Pinterest regular Pin It button, and we think these new hover buttons are pretty nice, too..!!