Add Pinterest Pin It button For Blogger Post

Add This To Del.icio.us Tweet/ReTweet This Share on Facebook StumbleUpon This Add to Technorati Digg This

Pinterest is another social photo and video sharing site like Facebook that allows it members to create and manage theme-based image collections such as events, interests, hobbies and many more. Pinterest's mission is to connect everybody in the world through the images and videos. Pinterest gives chance its users to share 'pins' on both Twitter and Facebook, which allows users to share and interact. You now can set pinterest pin it button on Blogger for your articles. The Pinned Images link to the Blogger Webpage. It will create huge upcoming new visitors for you. We know social power is massive. So Adding Pinterest Pin It button for Blogger Post is good thinking

Go to Blogger → Design → Edit HTML

Find the following code using F3

<data:post.body/>

Now paste the following code Just after it

Note: If there is aread more option on your template, You might have two or three <data:post.body/> on template. You must choose last one

<!-- Pinterest Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='pin-wrapper' style='margin:5px 10px 5px 0; text-align: left;'>
<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
<a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/>
</div> 
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarklet() {
    var e=document.createElement(&#39;script&#39;);
    e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
    e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
    e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
    document.body.appendChild(e);
}
</script>  
</b:if> 
<!-- Pinterest button End -->

Save the template and done

You can change the code so that the widget suits well with your template

Button type	`count-layout` value	`margin-left` (in line 5) value
	`vertical`	`-46px`
	`horizontal`	`-93px`
	`none`	`-46px`

You will find a nice pin it button after post

Pinterest Button As Widget

Add a HTML/Javascript widget and Paste the following code in the widget

Now save and done

<a href='javascript:void(run_pinmarklet())'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUjbAYsg7JwVZP624jOIFhBC9rfgF1MGOduUFsDEuxWenTB9hGUZyqVBOdtNU95gpNxwjHgXVVUYLS2x2BkKQH0DuW_z3EcQUM6Lyw0ESvS7N77JBFulC9e7iFNmmX98RqYXUzsNu8kOI3/s1600/pinmask2.png" style='margin:0; padding:0; border:none;'/></a>
<script type='text/javascript'>
function run_pinmarklet() {
  var e=document.createElement('script');
  e.setAttribute('type','text/javascript');
  e.setAttribute('charset','UTF-8');
  e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);
  document.body.appendChild(e);
}
</script>

This widget will work well for every single post in Blogger

Take only 10 seconds to share with your friends if you like. And thank you