Tag Archives: How to

Add ‘Pin It’ Button To Images In Your WordPress Blog

Without using Plugin: Add this code to your theme’s footer.php file before the </body> tag. Get Pinterest’s javascript at Goodies.

<script type=”text/javascript” src=”//assets.pinterest.com/js/pinit.js”></script>

Add this code to your theme’s single.php file wherever you want Pin It button to be visible:

<a href=”http://pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>&media=<?php echo catch_that_image() ?>&description=<?php the_title(); ?>” class=”pin-it-button” count-layout=”horizontal”><img border=”0″ src=”//assets.pinterest.com/images/PinExt.png” title=”Pin It” /></a>

Add this code in your theme’s functions.php file:

function catch_that_image() {
global $post, $posts;
$first_img = ”;
ob_start();
ob_end_clean();
$output = preg_match_all(‘/<img.+src=[‘”]([^'”]+)[‘”].*>/i’, $post->post_content, $matches);
$first_img = $matches [1] [0];
if(empty($first_img)){ //Defines a default image
$first_img = “/images/default.jpg”;
}
return $first_img;
}

Or You may use a WordPress plugin and that would be more easy for you. Use this plugin Pinterest Pin It Button For Images. Either search it on WP Plugin search or click the link and upload the folder to the /wp-content/plugins/ directory, Activate from ‘Plugins’ menu and Enjoy.