How To Add Custom Pin It Button To Blog

Creating and adding a custom Pin It button to your website is simple and it creates a quick and professional aspect to your website.

If you’ve ever wanted to add your own Pin It button, I can walk you through the simple 5 step process.

creating a custom pin it  button for your website

This post may contain affiliate links. Full disclosure here.

What Is A Custom Pin It Button

Many websites have a Pinterest image embedded in their blog posts in order to easily market a blog. A customized Pin It button is a small image that appears over an image when a website visitor hovers over an image. This encourages your website visitor to save a pin to Pinterest and helps spread the message that your website is awesome and helpful.

Don’t we all want that?

Why Add A Custom Button

Adding a Pin It button to your website is a simple way to encourage your website visitors to save the information on your website to either share with friends or come back to later.

Pinterest does encourage pinners to install a browser pin it extension, but not every Pinterest user take this step. A Pin It button ensures that even those without a browser extension installed can still Pin from your site.

Think of it as adding a clear call to action on your website directing your visitors to Pin your images and spread the word about your great content.

How To Add The Button

Within your WordPress dashboard, locate the plugins menu option and click “Add New”.

Once you have the plugin installed, you’ll need to configure the setting appropriately. This section will look a little intimidating, but you do not have to fiddle with too many settings to get this to work for you.

The Sections Tab

Within the selection tab, you only have to update 2 fields: Image Resolution and On Which Pages The Pin It Button Should Appear

Which Pages Pin It Button Should Appear

You have a few options to choose from. Personally I would only choose pages and posts and delete all other options. It’s not useful to have the Pin It button on your home page, especially if your homepage is a blog roll.

Your options:

  • [front] – front page
  • [single] – single posts
  • [page] – single pages
  • [archive] – archive pages
  • [search] – search pages
  • [category] – category pages
  • [tag] – tag pages
  • [home] – blog page
  • [post_type] where post_type is one of the following: post, page, attachment, elementor_library.
Image Resolution

You’ll want to avoid having your Pin It button appear over your social media icons and any other tiny graphics you have on your website. To combat this, configure the image resolution settings to min 200px width and height.

The Visual Tab

Once you are finished with the sections tab within the plugin settings, head on over the Visual tab.

Scroll down to Pin Image and select custom mode. Here you can upload your custom Pin It button. The image that uploads may be a little large but you can configure those settings by setting the height and width to 75px each.

Other Settings

Feel free to poke around the other settings if you need to, but no other changes are required for this to work properly.


Be sure to save your work and then go ahead and test out your website front end to make sure everything works perfectly!

Do you love how this one simple change has made your website look more professional?

Related Posts

Begin typing your search term above and press enter to search. Press ESC to cancel.

Back To Top