How to Add a Custom Pin It Button to Your WordPress Blog

written by:
posted on: January 26, 2018

If you want to drive people to your blog, it’s worth spending the time investing in Pinterest. No other social media platform will continue to drive traffic to your site the same way that Pinterest can. I’ve shared with you the steps to optimize your Pinterest account and best practices for pinning, but today, I wanted to show you how you can quickly setup a custom pin it button on your site.

What You Need:

  • Self-Hosted WordPress
  • Install Jquery Pin It button For Images

Instructions

  1. Install the Jquery Pin It Button for Images Plugin
  2. Once you have activated the plugin, go to SETTINGS < JQUERY PIN IT BUTTON
  3. In the SELECTION Tab, you will see different settings regarding MINIMUM IMAGE RESOLUTION and ON WHICH PAGES THE “PIN IT” BUTTON SHOULD BE SHOWN.
    1. Minimum Image Resolution: You want to adjust these settings to make sure that the Pin It button does not show up on your affiliate widget images. I regularly see blogs where their RewardStyle widgets have the pin it button. When I click that image, I’m taken to the Pinterest and not the affiliate link. Missed revenue for the blog, and poor user experience. Therefore, I typically set these images to be at least 350 pixels wide and tall. I’m also less particular about Pinterest on mobile since Safari has social sharing built-in.
    2. On Which Pages: I do not like specific parts of my site to be pin-able. For example, my static pages such as the About page – those images rarely change, nor do I want my Pinterest traffic to come to my about page. The brackets refer to the WordPress templates used in theme builds.
  4. Once I have updated my SELECTION setting, I press SAVE CHANGES. Then go to the VISUAL TAB.
  5. In the VISUAL TAB, you will upload your custom Pin It Button.
    1. SHOW BUTTON refers to when the button will appear; the default mode is that the button is displayed when the reader hovers overs the image.
    2. DESCRIPTION SOURCE is the text for the pin description. You can drag and drop these to reorder these choices in priority. If something is not available, it will go to the second choice. I typically select Post Title, Image Title Attribute, and Post Description (excerpt).
    3. TRANSPARENCY refers to the image transparency when the button appears. I prefer a very subtle effect – such as .05!
    4. Under PIN IMAGE, select CUSTOM. Then upload your image. The height and width will update automatically, but I always have it with retina displays. So if my Pinterest image is a square that’s 130 pixels wide, I will resize it to 65 pixels by 65 pixels.
    5. The PIN BUTTON Position refers to the location the button will appear on the hover. You can also add margins to the button if you don’t want it flush with the edges of the image.
    6. Press SAVE CHANGES when you have finished your settings.

How to Add a Pin It Button to WordPress How to Add a Pin It Button to WordPress

You are set! The pin button is now added to your images so that readers can easily pin your content. If anything looks wonky with your site, check these settings first.

I have used this plugin for years, and if a client ever runs into an issue, it’s always because this configuration have changed!

You might also like How to Add Instagram Widget to Your WordPress Blog and How to Create Columns in Pages

Want more WordPress tutorials? Check out more posts!

Editor's Note

Some of the links included throughout this website are affiliate links, which means that Lindsay Humes LLC receives a small commission when certain items are purchased. These affiliate links provide a means for the site to earn revenue and generate free content for readers. For more details, read the privacy policy here.

Blog Design Lindsay Humes
Meet The Author: Lindsay Humes

Leave a Comment

Your email address will not be published. Required fields are marked *

Join The Blog Better Audit!

Subscribe to join thousands of other creatives, bloggers, and freelancers and receive my free email course on how you can improve your WordPress website. My newsletter is full of tips on how you can grow your audience with actionable exercises that do not require a designer or developer!


Terms: