How to Add the Pin It Button to Your Site

This page may contain affiliate links from which I may make a commission at no cost to you. See How SideGains Makes Money for more information.

How to Add the Pin It Button

Pinterest is an absolute gold mine for traffic. It’s also an incredibly slick platform for you to build your brand. However, you need to connect it to your site, from your site. I’m going to show you how to add the Pin It button to your pages. This will make it easy for your visitors to promote your brand, website and Pinterest account.

Primarily I’ll explain how to add the Pin It button to WordPress. But don’t worry if you’re using a different platform because the steps can be replicated simply on your system.

The Benefits of Pinterest

Before delving into this short tutorial, I’ll take a moment to explain why Pinterest is so important for building your online business.

As of June 2019 Pinterest has some pretty impressive stats:

  • Pinterest has over 300 million active monthly users (MAU) so it’s a big market.
  • Over 76% of Pinterest active users live in the US , which is over 87 million people!
  • Pinterest drives over 8% of all eCommerce referral traffic.
  • 41% of US Internet users with a household income over $75k access Pinterest.
  • Pinterest usage is growing rapidly.

Source: Statista

So it’s the ideal platform for you to grow your brand reach. It’s also a fantastic source of traffic. But first you need to make it easy for people to start pinning images directly from your website.

There is a very simple way to add the Pinterest Pin it button to all the images on your site. So here’s how you do it…

Creating the Pin It Button Code

You don’t need to have a Pinterest account for this. My advice though if you don’t have one is to set one up. When you have an account you can take advantage of the ways in which Pinterest can extend your brand reach. The best way to do this is by creating Pinterest boards and adding pins to them.

You can set up a Pinterest account here if you don’t have one. It’s very simple!

The first step for how to set up pin it buttons involves using the Pinterest Widget Builder. This is one of the tools offered by the Pinterest Developer tools site.

Pinterest Widget Builder

Pinterest Widget Builder
Pinterest Widget Builder

You have several options at the top of the Widget Builder page. The one you need to select is the “Save button” option (shown in the image above).

You have several options to configure how you’d like the Pin It button to appear using the Button Type options:

  • You can choose “One Image” “Any Image” or “Hover”. For SideGains I use the “Hover” option because I think it’s a nice way to prompt visitors to pin my images.
  • The default is a square Pin It button, but you can choose for it to be round.
  • You have a similar choice for the Pin It button size. The default size is small but selecting larger increases it size to make it stand out more.
  • The final option relates to language. Unless you have a specific reason to target a language, you can leave Pinterest to handle button translation for you. This is how I’ve set up mine.

Whenever you make a configuration change, the Widget Builder gives a preview of how the Pin It button will look. It’s a good way for you to test the options until you’re happy with the way the button looks.

For interest, as you select different options, you’ll notice the “Copy and paste” HTML code beneath the preview image changes.

When you’re happy with the options you’ve chosen, you just need to copy the HTML code in the “Copy and paste” area. You’re then ready to add the code to your site.

Adding the Pin It Button to WordPress

You have to add the HTML code you copied from the Widget Builder into your WordPress theme files. It won’t work otherwise!

WordPress Theme Editor

I’ve added the code directly into my footer template because it’s easy to do via the WordPress admin tool.

Under the Appearance menu, click the Theme Editor link.

The file you need to edit for this is footer.php.

Select the file and paste the Pinterest Pin It code somewhere just before the closing </body> tag.

Click the Update File button to save it, and you should be all set.

It’s as simple as that!

Adding the Pin It Button to Other Platforms

The process will be very similar to WordPress, although you’ll have different template files. You need to add the Pinterest HTML code to a file that every page in your site uses.

You may also have a template footer file, but you could equally add the code to a header template.

Summary

  • Pinterest is a must have tool to help you promote your brand and drive traffic to your website.
  • You don’t need to install a plugin to handle the Pin It button to your site. The less plugins you are running, the less impact there is on your page speed: page load speed is important!
  • Add the Pin It button by creating the code for it in the Pinterest Widget Builder.
  • Simply paste the code into a template page that your whole site uses.
  • Start pinning images from your site using the Pinterest Pin it buttons that appear on all images!

That’s it for now. Thanks for visiting!

Paul

Please let me know if this has been useful. Alternatively ask me anything else about how to add Pin It buttons to your images in the comments section below.

You might also pin the image next to this text to your Pinterest account! 😉

Be the first to comment on "How to Add the Pin It Button to Your Site"

Leave a comment

Your email address will not be published.


*