Pages

15 March 2012

Pint it button update!

la la la love pinterest
I recently found out - to my surprise - that the Pint it button I had previously instructed you 
how to install, was no longer functioning! 
Therefore, I found (from here) another and much better way to add the pin it button into 
your footer under every post, which I'm gonna share with you right now. 
I've already added it, so you can check mine and see that it's working perfectly. 
Instructions are very easy, you just follow these simple steps:


Go to Dashboard -  Design - HTML and tick the Expand template
In your template find this line (click Ctr+F to help you find it): 
<data:post.body/> 
and immediately after it, copy and paste the following code:

<!-- 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 -->

Now click Save. That's it!
Now go and view your blog to check your brand new pin it button!
Pinterest
P.S.: When you mess with your template's html it's important to ALWAYS save a copy 
first to your hard disc (download your template), in case something goes wrong!


Photobucket 
Thanks for Making This Possible! Spread The Word!

6 comments:

  1. Olga, thanks for reminding me!
    I've been meaning to do it for a while now.

    I added mine right under the Blogger title - using these directions.
    http://www.paulsantosh.com/2012/03/pin-it-buttons-for-blogger.html

    All the best,
    ~ Dana

    ReplyDelete
  2. Great Olga - many thanks and great tip about saving a copy - I always forget.
    F x

    ReplyDelete
  3. Ολγα μου, πολύ μου αρέσει το μπλόγκ σου. τα αγγλικά μου βέβαια δεν τόσο προχωρημένα αλλα φτάνουν με όσα είδα στο μπλογκ σου, για να καταλάβω ότι είσαι πολύ προικισμένο άτομο.
    φιλιά
    θα τα λέμε.

    ReplyDelete
  4. You know it takes me a while to get a handle on these things Olga. I'll look into it - thanks as always for the great tips.
    xx

    ReplyDelete
  5. Olga, I just tried it but it doesn't work. Any ideas why it doesn't work?

    Jessie
    www.mixandchic.com

    ReplyDelete
    Replies
    1. Jessie, this is exactly what I've done! Did you check the "expand template"? You found the correct code and added after it all these code lines? If you did, then try to write a dummy post just to preview it and there you'll see it at the end! Let me know if it's OK!

      Delete

Your thoughtful comments keep me going! Feel free to share them!
However, I reserve the right to delete all anonymous comments and restrict comments that are irrelevant to the article, contain profanity or lack respect, personal attacks or those that seek to promote a personal or unrelated business.