Adding a "Pin It" Button To Your Blog Posts

http://fuckyeahryangosling.tumblr.com/

Pinterest is a brilliant source of the best of the Internet, a new way of using and sharing ideas and images, that is so new that the rules are being written as it grows bigger and bigger each day. There has been an interest lately of the ethics, rules and etiquette of this source of information.  The image above is from a great article on Pinterest's appeal and creative new ways to use it.

I've had my "Follow Me On Pinterest" button on my blog gadget list since the day I joined the site.  Following the advice of several articles on bad Pinterest manners, I've added a "Pin It" button at the end of each post.  This button is supposed to make it easy to track down an original source and let your readers easily attribute your work.  Use it to post new pins to your boards rather than just "repinning" at random.

So I wanted that cute little button at the bottom of my blog posts, if only to show my love and support for Pinterest...but learning how to add it to every post was easier said than done.  "Copy this code, paste it here," no problem, I can do that!  Instead it turned out to be a little harder than that....

Okay, it was A LOT harder--2 hours of teeth grinding frustration for me!  Pinterest seriously needs to clarify their language for us Hobby Bloggies!  They have both "basic" and "advanced" coding, but neither helped.  It took me a while, but I had finally found a great source: Add Pinterest Pin It Button To Blogger Post literally spells it out for you.  Kind of......

If you also use Blogger, and you are as clueless about HTML as I am--follow his steps, one at a time, and you'll have it done in less than 5 minutes!  He even tells you how to customize the image to match your site!!  

My problem was using my Ctrl+F button to find "<data:post.body/>." At the time, I had about 10 tabs open, 2 Word docs and a notepad...massive confusion was the inevitable outcome of such chaos--don't do that to yourself!  I finally managed to find that line of code in my blog template and was able to move on.

But here's my other mistake: if you want the pin to be at the bottom of your posts, you paste it "below" <data:post.body/>.  "Below" can be a relative term, especially for the HTML-disabled.  Does it go immediately after that code, on that same line?  Should I hit enter on that line and paste it on the new line in the middle of those 3 lines??  Does it have to be in line with the rest of the code?  I swear, I can make the simplest task difficult....

For me, it goes after the last ">" of that last line of that little group of code. In my code, it looked like this originally:
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>

      <more code

And now it looks like this:
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
       </div>
Copy and paste the new code from this article here
      <more code

"Pin it" button: conquered!!