Tip: Easy instructions for adding Pinterest to each post

Adding Pinterest correct to your Blogger site can be a bit challenging; most people take the easy way out and add it site-wide as opposed to adding it to the specific post footer code. Why is it better to add it to the specific post footer? Because you can add default descriptive information into the pin!

The following code (here's the clean version) and instructions show you how to add the button to your post footer next to all of your other social sharing buttons.

Go to the template editor, Edit the HTML, check the box to expand the widget template, search for:

<b:includable id="shareButtons" var="post">

Scroll down that section of code where are the share buttons are, and about the last line or so you'll see:

<b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container' style='width: 32px; overflow: hidden;'><data:post.dummyTag/></div></b:if>

Add the following code right before that line:

<div class='goog-inline-block dummy-container'><a href='javascript:void((function()%7Bvar%20e=document.createElement(&apos;script&apos;);
e.setAttribute(&apos;type&apos;,&apos;text/javascript&apos;);
e.setAttribute(&apos;charset&apos;,&apos;UTF-8&apos;);
e.setAttribute(&apos;src&apos;,&apos;http://assets.pinterest.com/js/pinmarklet.js?r=&apos;+Math.random()*99999999); document.body.appendChild(e)%7D)());'><img alt='Pin It' onclick='doPinIt();' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGMXxteEcnXwNbW4RjY3nQV943eE8J8yJz8kKYx2VYEyE02vMpcwjgc-aqrdE41bzmH6e-Yq83D_CEnd3Cgdk_0bB-3lOG4HyOHFzTJT8Od8GZuPLkgNYWRzOgN6QanW0jd4VcbrEesso/' style='margin-top: -3px; margin-right: 0; margin-bottom: 0; border: 0; padding: 0;'/></a></div>

Before you go overboard on social sharing buttons please read this article: Forget Facebook, keep your fans to yourself!

Comments

  1. Just added this to my Blogger blog @ http://talesfrombabylon.com and it worked like a charm. Thank you for this.

    ReplyDelete
  2. Hi! I inserted the clean code before the line above but it didn't work. Any idea as to where I should start to get it working? I know that vague but I'm only learning how to manipulate the code tutorial by tutorial. Thanks and Happy New Year!

    ReplyDelete
    Replies
    1. what's the URL of your blog where you've inserted the code? I'll check it out.

      Delete

Post a Comment