How to Add a Pin It! Button on Blogger

Pin It

I am so in love with pinterest it's not even funny.  I could waste days just clicking through pages and pages of pins.  And with millions of people doing the same thing as me, pinterest is a great way to get your work out there.  Adding a simple Pin It! button to the top or bottom of your posts can do wonders for your popularity.  So here's how you do it:

First, we're heading on over to our "Edit HTML" screen, and checking the "Expand Widget Templates" box:

Then, we're going to use "Ctrl + f" and search for this text:

<data:post.body/>

Now, if you want the "Pin It!" button to appear before the post, you are going to insert the following code above that text, and if you want it after the post, add it after.  Here is the code that you'll need:

<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;'/>
<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> 

 Perfect! Now you have your own Pin It! Button!  Just click Save Template and you're done!