DISCLAIMER: this post is older than one year and may not be up to date with latest WordPress version.

As a blogger or website owner, your goal is probably to attract traffic to your website. While facebook and twitter are definitely the two bigger social networking sites, Pinterest is also bringing lots of traffic to blogs. So what about adding a pinterest “Pin It” button to your blog? Let’s do it.

The first thing to do is to paste the following snippet where you’d like the “Pin It” button to be displayed. Note that this code must be inserted within the loop.

<a href="http://pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>&media=<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail' ); echo $thumb['0']; ?>&description=<?php the_title(); ?>" class="pin-it-button" count-layout="horizontal">Pin It</a>

Once done, open your footer.php file and add the pinterest JavaScript code:

<script type="text/javascript" src="http://assets.pinterest.com/js/pinit.js"></script>

Thanks to Douglas Karr for the cool code!



  1. Thanks but If I were you I’d use the_title_attribute() to avoid bad surprise with fancy title

  2. Thnaks but you should use the_title_attribute() instead of the_title() to avoid bad surprise if title contains “..”

  3. Thanks for sharing. I was looking for a pinterest button code.

  4. Thanks for the quick tip! I normally use an entire social bar like AddThis, but I’ve been thinking of using a lone Pinterest button on certain sites.

  5. Impressive snippet, love it .
    Easy to use and hassle free.

  6. Will it also add a counter with pinterest icon? I want to add a counter but my client requires to start this counter from 100.. Is it also possible?

  7. This is nice. Also, I have seen few of the blog posts in which, when you hover over the images, the Pinterest button appears in order to pin that image. Any tip on how to do that?

Leave a Comment

Your email address will not be published. Required fields are marked *