How to Add a Custom Pin-it Button To Your Blog (Step-by-Step Tutorial)


As you probably know, I am a big fan of Pinterest. I hang out a lot there.

Some of you have been asking me to talk about how you can get a custom “Pin it” button to appear every time someone hovers on one of your images.

That’s precisely what you will learn in today’s step-by-step tutorial!

Here's how you can get a custom "Pin it" button to appear on your images when someone hovers on one of your images. This is a complete step-by-step tutorial!
Pin me, please?

Why Add a Custom Pin It Button?

With so many Pinterest strategies to follow and Pinterest changing its algorithm every other day, something has not changed – getting more people to pin your post from your blog post itself!

(By the way – follow me on Pinterest if you have not already!)

Adding a custom pin it button may increase your pin rates as it prompts your readers to pin your post for you.

How to Add a Custom Pin It Button To Your Blog

Sign up for my free list building webinar!

Option 1: Use Social Warfare

Social Warfare is the social sharing plugin I use and recommend.

If you are using the Social Warfare plugin, you can very easily enable your “pin it button” option. Social Warfare has already created a custom pin it button for you to use.

Under the Social Warfare settings, go to the display tab, and under “Image Hover Pin Button”, toggle the “pin it button” option to ON:


When someone hovers over your images, a “pin it button” will show up!

Here is an example of what happens when someone hovers over your images when you have the “pin it button” option enabled:


You can change the position of the save button, it does not have to be at the center of the image.

Option 2: JQuery Plugin

If you want to use your own custom pin it button design or don’t have Social Warfare, option #2 will be perfect for you.

Download the JQuery Plugin

Download this JQuery plugin. It is called “jQuery Pin It Button for Images”.

Toggle plugin settings

Once you are in, look for the plugin settings on the left of your WordPress dashboard.

You want to do the following under the “Visual” tab:

  • Pick the “Custom” option and then upload your custom pin it button
  • Adjust the size of your button to something acceptable. I recommend checking an actual blog post to see how it looks like before you settle on a size you like.
  • Hit save changes and you’re all done!


How to Add a Custom Pin-it Button To Your Blog (Step-by-Step Tutorial)Click To Tweet

I hope that you’ve enjoyed this quick tutorial about how you can add a custom pin it button to your blog posts.

You may like these posts as well:

xx Raelyn

Sign up for my free list building webinar!
How to Add a Custom Pin-it Button To Your Blog (Step-by-Step Tutorial)

A tiny request: If you liked this post, please share this?

I know most people don’t share because they feel that us bloggers don’t need their “tiny” social share. But here’s the truth…

I built this blog piece by piece, one small share at a time, and will continue to do so. So thank you so much for your support, my reader.

A share from you would seriously help a lot with the growth of this blog.

Some great suggestions:
 Pin it! (I even made a pretty pin for ya!)
 Share it to your favorite blog + biz Facebook group
 Tweet it!

It won’t take more than 10 seconds of your time. The share buttons are right here. 🙂

Thank you so much!

If you enjoyed this post, get updates from me. (it’s FREE)

You’re awesome for staying till the end. Signup for my newsletter below.

I send email updates about new posts, and tips and tricks to build & monetize your online business.

Join The Creator CEO Scale Newsletter 💙

Exclusive newsletter: Want to get access to my best strategies and business systems privately with my newsletter subscribers?

Plus, you also get access to the behind-the-scenes confessionals of what it’s really like being a creator CEO.

Join us?

Privacy Policy: We will never spam or sell your details

Similar Posts