Make your blogger blog images Pinterest friendly by adding Pinterest Pin it hover button for your images in blogger blog. The main advantage of adding Pin It hover button on your blog is that the visitors of your blog will be able to pin the images on the Pinterest quickly by clicking the pin it button which is viewed when hover. If the visitor of your blog likes your image in the blog than he might pin your image and you will also get more exposure to your blog.
So now we will be showing you how you can add different layouts of Pinterest Pin It hover button on your blogger.
Just go to blogger > Template > Edit HTML, just search for </body> tag and insert the below code above the </body> tag.
Pin It Hover Round Shape Small Button:
Pin It Hover Round Shape Large Button:
Pin It Hover Rectangle Shape Small Gray Button:
Pin It Hover Rectangle Shape Small Red Button:
Pin It Hover Rectangle Shape Small White Button:
Pin It Hover Rectangle Large Small Gray Button:
Pin It Hover Rectangle Shape Large Red Button:
Pin It Hover Rectangle Shape Large White Button:
So now we will be showing you how you can add different layouts of Pinterest Pin It hover button on your blogger.
Just go to blogger > Template > Edit HTML, just search for </body> tag and insert the below code above the </body> tag.
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-shape="round" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-shape="round" data-pin-height="32" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-color="red" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-color="white" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-height="28" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-color="red" data-pin-height="28" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
<!-- Please call pinit.js only once per page -->
<script type="text/javascript" data-pin-color="white" data-pin-height="28" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>
Thanks for info...did the job!!
ReplyDelete