Do you want to add a “Pin It” button from Pinterest to your WordPress site?
Pinterest is a famous social media platform for sharing visual material and driving traffic to your website. Visitors will find it easy to share your material if you include a pin it button.
We’ll show you how to add the Pinterest “Pin It” button to your WordPress blog in this article.
You may add a Pinterest Pin It button to your WordPress website in a variety of ways. To pin your photographs, you can use a WordPress plugin or manually create a Pin It button using code.
Aside from that, you may use a shortcode to add the Pinterest button to any page on your site, and visitors can save images to Pinterest simply hovering over them.
We’ll go over all of these options in this tutorial so you can pick your favorite.
- Using a Plugin to Add a Pinterest “Pin It” Button
- Applying a Pinterest Pin It Button to WordPress Manually
- Making a Pinterest Button Shortcode
- Adding a Pin It Button to Your Images from Pinterest
Using a Plugin to Add a Pinterest “Pin It” Button
In 2016, Pinterest changed the name of the “Pin It” button to “Save.”
Despite the fact that some plugins still call themselves “Pin It” instead of “Save,” they all perform the same thing: they pin your photographs to Pinterest.
Using a social sharing plugin is the simplest approach to add a Pinterest button to your WordPress site.
For this, we propose using the Shared Counts plugin. It’s one of the best social media plugins for WordPress because it’s free and lets you quickly add the Pinterest button, as well as other major social media networks.
Installing and activating the Shared Counts plugin is required to get started. For further instructions, see our step-by-step tutorial on how to install a WordPress plugin.
After installing the plugin, go to Settings » Shared Counts to customize it.
Scroll down to the Display section on the settings page, and then click the “Share Buttons to Display” textbox.
This will bring up a dropdown menu where you can choose which social networking services to add. Pinterest, along with Facebook and Twitter, will appear in that box by default.
You can choose from a variety of button styles under the ‘Share button style’ option of the plugin. You may also choose where the Pinterest button will appear and what type of post it will appear on.
Don’t forget to click the Save Changes button once you’ve made your selections.
You can now see the Pinterest button in action on any post on your website.
Another cool feature of SharedCounts is its free Custom Pinterest Image addon, which can be found on Github. This allows you to create a Pinterest-optimized custom Pinterest sharing image and description.
Applying a Pinterest Pin It Button to WordPress Manually
Instead of using a plugin, some intermediate users may want to manually add social sharing icons to their WordPress site.
Let’s see how to manually add a Pinterest button to your WordPress site.
The first step is to create a comprehensive backup of your WordPress site. This will assist you in restoring your site if something goes wrong.
The next step is to add some code to your footer. You may use a plugin to add footer code to your WordPress site, or you can do it directly using the steps below.
To begin, use an FTP client to connect to your WordPress hosting account, then navigate to the /wp-content/themes/ folder.
You’ll need to access your current theme folder and look for the footer.php file from there.
Simply right-click on the file and choose Download from the menu that appears. This will save the file footer.php to your computer.
Now, open the footer.php file with a plain text editor such as Notepad and paste the following script just before the </body>tag.
<script type="text/javascript">(function() {- window.PinIt = window.PinIt || { loaded:false };
if(window.PinIt.loaded) return;- window.PinIt.loaded = true;
functionasync_load(){vars = document.createElement("script");s.type = "text/javascript";- s.async = true;
s.src = "https://assets.pinterest.com/js/pinit.js";varx = 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>
After that, save the file and return it to the current theme folder.
After that, go to your theme’s template file and find the button’s template file. If you’re unsure, see our WordPress template hierarchy beginner’s guide. The single.php file is usually the culprit, although it all depends on your theme.
Simply download the template file from your theme folder and edit it there. The following code must then be added.
You must first decide where you want it to be placed.
<?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>
In the share URL parameter, the above code displays the Pinterest button with your featured image, title, description, and post URL.
Finally, save the file and use FTP to re-upload it to your theme directory.
This will add a vertical share button to your website’s content. Simply update the count-layout parameter to horizontal if you want the horizontal share button to appear.
Making a Pinterest Button Shortcode
Shortcodes in WordPress make it simple to include dynamic elements in your posts, pages, and widgets. You can manually add a Pinterest button to your articles by generating a shortcode.
To begin, add the following code to the functions.php file of your theme or a site-specific plugin:
functionget_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');
You may use the [pin] shortcode in your WordPress posts to display the Pinterest button after you’ve added the code.
Adding a Pin It Button to Your Images from Pinterest
If you own a fashion, photography, or portfolio website, you’ll want your photographs to be shared on Pinterest to boost traffic to your site.
Adding a Pinterest Pin it button to your photos in WordPress allows users to effortlessly pin any image on your site by hovering their cursor over it.
The Weblizar Pin It Button On Image Hover And Post plugin must first be installed and activated. For additional information, see our tutorial on how to install a WordPress plugin.
To customize the plugin, navigate to the PinIt Button page in your WordPress admin panel after it has been activated.
On the settings page, you can choose whether the Pin It button should appear on your WordPress blog posts or pages. Also, make sure that the ‘Show Pin It Button On Image Hover’ option is set to ‘Yes’.
Aside from that, the plugin allows you to display the Pin It Button on mobile devices and change the size of the button. After that, you must save the settings.
You may now go to your website and hover your mouse over any image to see the Pinterest Pin It or Save option.
If you wish to hide certain photos from the Pin It or Save button, go to the PinIt Button page in your WordPress dashboard and choose the ‘Exclude Images’ option in the settings.
Simply enter the picture URL you wish to hide from the pin it button and hit the ‘+ Add’ button.
You may also use the plugin to hide the Pinterest Save or Pin It button from certain pages. Simply go to the ‘Exclude Pages’ tab and type in the page’s name.
That concludes our discussion.
We hope this post demonstrated how to incorporate a Pinterest “Pin It” button into your WordPress blog. You might also be interested in our guide to creating an email newsletter.
If you liked this post, please find and follow us on Instagram, Twitter and Facebook.
