How to Add Pinterest Pin It button to your WordPress Blog
Last Updated on June 4, 2021
Pinterest can be a great place to get a new source of traffic to your blog. We use Pinterest here at WP Cupid Blog, and we see great results in the amount of traffic that comes from Pinterest. In this post, we will easily show you how to add Pinterest pin it button to your WordPress blog.
Pin Image To Pinterest
Video Tutorial: How To Add Pinterest Pin It Button To Your WordPress Blog
How To Add Pinterest Pin It Button To Your WordPress Blog
Adding a Pinterest Pin it Button to WordPress Using Plugin
One of the quickest and easiest ways you can go about adding a Pinterest “Pin it” button in your WordPress site is by using a social sharing plugin. The plugin we recommend you use is the Floating Social Bar. To start off, you need to install and activate the Floating Social Bar plugin. Once you get the plugin installed and activated you need to go to the Settings area and then click on Floating Social Bar to configure the plugin.
You are going to see available social services consisting of Linkedin, Facebook, Twitter, Google Plus, and Pinterest. You will see under that a section named, “Enabled Social Services.” All you have to do is drag and drop the Pinterest button to the Enabled Social Services section. If you want to include the other social media buttons that are showcased all you have to do is drag and drop them down to the Enabled Social Services along with the Pinterest button you dragged and dropped. Once you have the Pinterest button and any other buttons enabled just click save settings.
Another cool feature with this plugin is that you can select to show the Pinterest Pin It button on posts, pages, media, Avia framework, and Portfolio items. Select where you would like to show your Pinterest Pin It button and click save changes and your all set.
Now all you have to do is head on over to your blog and take a look. You will now see the Pinterest Pin It button showing towards the top of your site as you can see in the example below.
Manually Adding a Pinterest Pin it Button to WordPress
Now I want to go over how to manually add a Pinterest Pin it button in WordPress. You want to start off by copying and pasting the below script in your footer.php file right before the body close tag.
Once you are complete with the above task copy and paste the code below into your single.php file at a location of your choice.
<script type="text/javascript"> (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 = "http://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); })(); </script>
To go into more detail about the code above and what it is doing is it is pulling your Featured Image, the title of your blog post as the description, and the URL of the blog post. I do want to mention the code above is specifically designed for the vertical share button. If you need a horizontal share button, this is a very easy thing to do. What you want to do is change count-layout parameter to horizontal. You will find this located at the end of the second code provided below. You will see it says vertical. Just change it to say horizontal. Make sure you scroll all the way over to get the full code.
<?php $pinterestimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?> <a href="http://pinterest.com/pin/create/button/?url=<?php echo urlencode(get_permalink($post->ID)); ?>&media=<?php echo $pinterestimage[0]; ?>&description=<?php the_title(); ?>" class="pin-it-button" count-layout="vertical">Pin It</a>
Pinterest shortcode
The last thing I want to go over is if you want to create a shortcode for the Pinterest Pin It button. To do this, you want to copy and paste the below code either in your theme’s functions.php file or your site plugin’s file. Make sure you scroll all the way over when copying the code.
<?php function get_pin($atts) { $pinterestimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); return '<a href="http://pinterest.com/pin/create/button/?url=' . urlencode(get_permalink($post->ID)) . '&media=' . $pinterestimage[0] . '&description=' . get_the_title() .'" class="pin-it-button" count-layout="vertical">Pin It</a>'; } add_shortcode('pin', 'get_pin'); ?>
Final Thoughts
We hope this article helped you and showed you how to add Pinterest Pin It button to your WordPress blog.
Let us know in the comments below if this was helpful! We would love to hear from you.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
- Is Bluehost Sitelock Security Essentials Worth It? Do You Need It? - June 16, 2021
- Is Bluehost Domain Privacy Protection Worth It? Do You Need It? - February 18, 2021
- Is Bluehost SEO Tools Start Worth It? Do You Need It? - February 17, 2021
I can’t believe how great this site is. You keep up the good work. That’s my advice pal.
Glad you like it. Thank you!
I know this if off topic but I’m looking into starting my own weblog and was
curious what all is needed to get setup? I’m assuming having a blog like
yours would cost a pretty penny? I’m not very web savvy so I’m not
100% sure. Any tips or advice would be greatly appreciated.
Cheers
Thanks for reaching out! Setting up your own blog is an easy process and is cheap. Here is a link to our step by step post on starting a blog with Bluehost that goes through the steps. https://wpcupidblog.com/how-to-start-a-wordpress-blog-on-bluehost