Family Encyclopedia >> Electronics

Expert Guide: Add Pinterest 'Pin It' Button to Your WordPress Blog

As experienced WordPress developers who've boosted site traffic through social platforms like Pinterest, we've seen firsthand how a simple 'Pin It' button can drive significant referrals. After noticing steady Pinterest traffic on our blogs, we integrated it fully into List25. Here's our proven step-by-step guide to adding the Pinterest 'Pin It' button to your WordPress site.

Expert Guide: Add Pinterest  Pin It  Button to Your WordPress Blog

Add Pinterest 'Pin It' Button Using a Plugin (Easiest Method)

The simplest way to add a Pinterest 'Pin It' button is with a reliable social sharing plugin. We recommend a floating social bar plugin, which we use on our production sites for optimal performance and user engagement. Install and activate the plugin, then navigate to Settings » Floating Social Bar to customize.

Expert Guide: Add Pinterest  Pin It  Button to Your WordPress Blog

Drag the Pinterest button into the Social Services Enabled section alongside other buttons, then save changes. This setup delivers a seamless, floating share bar trusted by thousands of sites.

Manually Add Pinterest 'Pin It' Button in WordPress

For more control, add this official Pinterest script to your theme's footer.php file, just before the closing </body> tag:

(function() {
    window.PinIt = window.PinIt || {loaded: false};
    if (window.PinIt.loaded) { return; }
    window.PinIt.loaded = true;
    function async_load() {
        var s = document.createElement("script");
        s.type = "text/javascript";
        s.async = true;
        s.src = "https://assets.pinterest.com/js/pinit.js";
        var x = document.getElementsByTagName("script")[0];
        x.parentNode.insertBefore(s, x);
    }
    if (window.attachEvent)
        window.attachEvent("onload", async_load);
    else
        window.addEventListener("load", async_load, false);
})();

Next, insert this code into your single.php file where you want the button:

<a href="https://pinterest.com/pin/create/button/?url=<?php echo urlencode(get_permalink()); ?>&media=<?php $pinterestimage = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full'); echo $pinterestimage[0]; ?>&description=<?php echo urlencode(get_the_title($post->ID)); ?>" class="pin-it-button" count-layout="vertical">Pin It</a>

This code pulls your post's featured image, title (as description), and URL for perfect pinning. For a horizontal button, change count-layout="vertical" to horizontal.

Pro tip: Test thoroughly on a staging site first—we've optimized hundreds of blogs this way.

Pinterest 'Pin It' Shortcode for Ultimate Flexibility

For shortcode convenience, add this to your theme's functions.php or a custom plugin:

function get_pin() {
    $pinterestimage = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), 'full');
    return '<a href="https://pinterest.com/pin/create/button/?url=' . urlencode(get_permalink(get_the_ID())) . '&media=' . $pinterestimage[0] . '&description=' . urlencode(get_the_title()) . '" class="pin-it-button" count-layout="vertical">Pin It</a>';
}
add_shortcode('pin', 'get_pin');

Use [pin] anywhere in posts or pages. Follow us on Pinterest for more WordPress tips from Syed Balkhi and team.