Top
Free Course: Graphic Design for Beginners

How to Add a Custom Pin It Button in WordPress

There’s so much to know about Pinterest in terms of pinning strategy, how to write the best descriptions, and more. But what about how to get people to pin your content directly from your blog? The trick is in making it easy for them to pin!

In this post, I’m going to show you how to add a custom “Pin It” button to your blog images in effort to get your content pinned more often. These buttons appear when a reader hovers their mouse cursor over your images. It’s a fantastic way to add a little something extra to your website – further expanding your brand.

At the end of this post, I’ve even included some free buttons I made just for you, so look out for those!

How to install a custom pin it button in WordPress to make it easier for your audience to share your content and grow your following. Set up a #custom #pinitbutton on #WordPress with ease thanks to this #stepbystep #tutorial - including a #freedownload of buttons for you to use. #blogging #tutorials #contentmarketing

 

Step 1: Install the Plugin

Within your WordPress dashboard, go to Plugins >> Add New, then search for a plugin called jQuery Pin It Button For Images. Once you’ve found it, click Install, then activate.

 

Step 2: Configure the Settings

Once you’ve installed the plugin and activated it, you need to configure the settings by going to Settings >> jQuery Pin It Button For Images where you’ll find quite a bit that you can configure. I’m not going to cover all of them, because most of it doesn’t need to be changed. Instead, I’m going to focus on the ones I change and why.

The first settings page you’ll come to is called Selection, and you can leave most of the settings to their default except for two that I find very important: Which pages the pin it buttons show up on, and the Minimum resolution that should trigger a pin it button.

 

Which pages the pin it buttons show up on

This settings allows you to control what pages you want your pin it buttons to be active on. It’s important to not overwhelm the audience with a bunch of unnecessary buttons, so I focus on keeping the pin it buttons active only on “Pages” and “Single Posts”.

There’s lots of options, so choose what works best for your needs and your WordPress theme:

  • [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.

 

Minimum resolution that should trigger a pin it button

I use this setting to prevent my pin it button from displaying on all of the smaller images on my website that I wouldn’t really want people pinning. Plus it just looks really messy to have the button popping up on every image.

I know what size my Pin images are, so I set mine so that the “Pin it” button will only show up if the image is at least 700 pixels wide and 1050 pixels tall (on regular screens) and 200 pixels wide by 300 pixels tall on mobile. This prevents any images I may be using that aren’t a 2:30 ratio from having the button.

 

Step 3: Customize the Visuals

Here’s where things get really fun! Click on the tab labeled Visual at the top of the page to access the next settings we’re going to work on – the fun, visual stuff.

 

Transparency Value

In this setting, you can choose whether or not to apply a semi-opacity to your pin images when you hover over them. I like this because it can draw more attention to your Pin It button. However, if you decide to use this… don’t overdo it! I recommend a really low number like 0.1 or 0.2 because otherwise it doesn’t look as nice and subtle.

Here’s what my pin image looks like normally vs on hover:

Or, I mean… you can just scroll back on up and hover over my image. Would you pin it too please while you’re up there? I’ll wait. 😊

 

Custom Pin It Button

This is where the real magic happens! The default settings show you that you can use the default button that comes with the plugin, or you can upload a custom button of your own (I’ve included 4 free buttons for you to download below). All you need to do is to ticker Custom, and select to Upload an image using media library.

Keep in mind that whatever size your custom image is, is what size it’ll show up as automatically. You can manually change it in this section of the settings. I recommend setting the width and/or height to 75px.

Hey… enter your name and email, and I’ll send you those free buttons for you to use + weekly emails all about blogging.

 

Button Position and Margins

These settings control the positioning of your pin it button. This is purely based on personal taste and the style of your blog and you have the follow positioning choices:

  • Top-Left
  • Top-Right
  • Bottom-Left
  • Bottom-Right
  • Middle

The margin numbers control where your button is set within the positioning choice you made. This is also a personal preference thing. It defaults to 20px Top/Bottom/Left/Right and you can increase the number if you feel like this isn’t enough space between the edge of your pin image and your button.

Don’t forget to save your changes and then check out how it all looks on your website! A custom button looks so much nicer than the standard Pinterest button and it really stands out so you’ll get your images pinned more frequently.


(Or Click Here to get a set of 10 buttons in your brand color, starting at just $3)

Get Pinned Academy is the best course to empower you to create drool worthy pins that get shared and help you drive traffic to your blog or business.

Jean Peterson

5.0
2019-01-10T02:42:09+00:00

Jean Peterson

Get Pinned Academy is the best course to empower you to create drool worthy pins that get shared and help you drive traffic to your blog or business.

Kimi Kinsey has been an ENORMOUS source of both resources and inspiration for me throughout my business journey. I have been in her Facebook Group Hexagon Connection since I first started my business and it has been a complete game changer!

Heather Terwilliger

5.0
2019-01-10T19:32:25+00:00

Heather Terwilliger

Kimi Kinsey has been an ENORMOUS source of both resources and inspiration for me throughout my business journey. I have been in her Facebook Group Hexagon Connection since I first started my business and it has been a complete game changer!

I've read my share of design material on the internet and elsewhere, but I could tell from lesson 1 that Kimi's [graphic design] course is a cut above. Her visuals clearly show you what NOT to do, as well as how to make your design elements look as clean and professional as possible.

Rachel Fearon

5.0
2019-01-11T18:08:19+00:00

Rachel Fearon

I've read my share of design material on the internet and elsewhere, but I could tell from lesson 1 that Kimi's [graphic design] course is a cut above. Her visuals clearly show you what NOT to do, as well as how to make your design elements look as clean and professional as possible.

She laid everything out in such a clear, simple way. Even as a long-time Pinterest user, I learned some new strategies and design tips that have helped me to increase my traffic from Pinterest.

Cate Rosales

5.0
2019-01-10T02:34:16+00:00

Cate Rosales

She laid everything out in such a clear, simple way. Even as a long-time Pinterest user, I learned some new strategies and design tips that have helped me to increase my traffic from Pinterest.

After following Kimi’s guidance, I now have a strategy for Pinterest that I can feel confident about and that helps my business grow.

Jordan Prindle

5.0
2019-01-10T02:40:47+00:00

Jordan Prindle

After following Kimi’s guidance, I now have a strategy for Pinterest that I can feel confident about and that helps my business grow.
5
5





Get a special promo code for select products from this shop (like this one!) absolutely free + updates on sales and new products.
Yay! Give me the stuff!
We hate SPAM (unless it's with eggs) and promise to keep your email address safe.
close-link
Get Pinned Academy Logo
Fill out the form to enroll in Get Pinned Academy - a free course that will teach you how to use Pinterest for your business!
Yes, Enroll me now for FREE!
We hate SPAM (unless it's with eggs) and promise to keep your email address safe.
close-link
SUBSCRIBE
Please read the Privacy Policy.
close-link
SIGN ME UP!
We hate SPAM (unless it's with eggs).
close-link
ENROLL NOW FOR FREE!
We hate SPAM (unless it's with eggs) and promise to keep your email address safe.
close-link
DOWNLOAD THE FREE CHEAT SHEET