How to add a custom Pin It button in WordPress
Reading Time: 2 minutes
Promoting your website can be a lot of work, but you can make it easier on yourself by letting your visitors help you promote your website! Make it easy for your visitors to pin your images: here’s how to add a custom pin it button in WordPress.
The jQuery Pin It Button for Images plugin allows you to add a custom ‘Pin it’ button, so you can make it pretty & on-brand. You can make it bigger and position it in the center of the image so more people see it.
Plugin: jQuery Pin It Button for Images
- Install and activate the jQuery Pin It Button for Images.
- In Settings > jQuery Pin It Button for Images (Selection Settings), you can set which images you want to be pinnable and on which pages you want your images to show the Pin It button when a visitor hovers over an image.
I like to only have the Pin It button on my featured images in blog posts. If you’d like to do the same, you can find out what selector you need to use with the Inspect Element in Chrome. (Most other browsers do work similarly)
Go to a blog post, right click the featured image and click “Inspect element”. A window pops open with the html code of your site. The code for the image should be selected, similar to this:
In this case, the selector will be
If your featured image has a wrapper (usually a div) around it with a class, the selector will be .classname img. If it has an id instead of a class, you need to use #idname img.
I also only want to show it on blog posts, so I only selected [single] for the pages it should be shown on.
- In the Visual Settings tab, you can choose where it should get the description for the pin from, the position you want the Pin It button to show on top of your Pinterest image, and the transparency of the Pinterest image when the Pin It button shows.
Custom Images for the Pin It Button
Also within Visual Settings, you can upload your own custom image to use for the Pin It button.
I help solopreneurs to stop struggling with code and Canva. You can spend your time and energy showing up for your clients and promoting your offers. Learn more.
Get the free
Course Launch Planner & Checklist
It'll help you create a plan, stop wasting time googling and avoid missing any of the million moving pieces so you can feel prepared & confident about your launch!
Everything you need to do for a launch – without burning yourself out before enrollment opens
Prepare for your course launch using my free Course Launch Planner & Checklist.
It'll help you create a plan, stop wasting time googling, and avoid missing any of the million moving pieces so you can feel prepared & confident about your launch.
Leave a Comment