Want to add a Pinterest button directly on your images so readers can pin them easily? In this post, I’ll walk you through how to add a Pinterest save button to WordPress using a plugin and custom CSS to match your brand.
With a visible Pinterest button on your blog post images, visitors can easily save them to their Pinterest boards. More pins mean more eyes on your content, which drives traffic back to your site and helps grow your audience.
Why add a Pinterest save button
If a visitor has the Pinterest browser extension installed, they can pin your images through their browser. But having a pin button directly on your images is much more visible. It removes the friction of finding the extension, so more readers will actually pin your content.
With a WordPress plugin, you can automatically add Pinterest save buttons to your featured images. This is way more effective than hoping people will find the browser extension on their own.
How to add a Pinterest button to WordPress
The jQuery Pin It Button plugin I previously recommended is no longer maintained. However, there’s a solid alternative: the Weblizar Pin It Button plugin. If you’re comfortable with CSS, you can customize it to match your brand.
Step 1: Install and activate the Pinterest button plugin
First, find and install the “Weblizar Pin It Button On Image Hover And Post” plugin. In your WordPress dashboard, navigate to Plugins > Add New Plugin, then search for it by name. Click Install, then Activate.
Step 2: Configure the Pinterest button settings
After activating the plugin, go to the PinIt Button tab in your left admin panel. You can choose the button size and where it appears (blog posts, pages, or both). Make sure “Show Pin It Button On Image Hover” is set to Yes, or the button won’t display.
If you want to exclude certain images or pages, navigate to those sections and add them to the exclusion list.
Here’s what the plugin settings look like:
Step 3: Customize your Pinterest button with CSS
The plugin doesn’t have a built-in option to upload a custom button image, but you can add one with CSS. This lets you match your brand colors and design.
First, upload your custom pin button image to your Media Library. Then copy this CSS and replace the URL with your image URL. Add it to your site using your theme’s custom CSS option or the WPCode plugin.
span(class*=_button_pin) {
background: transparent url('URL TO YOUR PIN BUTTON IMAGE HERE') 0 0 no-repeat !important;
background-size: contain !important;
padding: 0 !important;
font-size: 0 !important;
box-shadow: none;
width: 150px !important;
height: 150px;
}Here’s what each line does:
The CSS selector span(class*=_button_pin) targets any span with a class containing “_button_pin”. The plugin generates class names with timestamps (like PIN_1706864062770_button_pin), so this selector ensures your CSS keeps working even as the timestamp changes. The !important flags make sure your custom styles override the plugin’s defaults.
The background property sets a transparent background and applies your custom image. The 0 0 removes extra spacing around the image, and no-repeat prevents tiling.
background-size: contain ensures your button displays fully, even if you resize it. padding: 0 removes extra spacing. Setting font-size to 0 hides the default “Save” text. box-shadow: none removes the plugin’s default button styling so your custom image looks exactly as you designed it.
Use the width and height attributes to set your button size. Match your actual image dimensions, or keep the same aspect ratio if you resize it. For example, if your image is 250px wide and 100px tall, and you want it 50px tall, set the width to 125px.
Step 4: Optimize your Pinterest images and descriptions
Now that you know how to add a Pinterest button to WordPress, make sure your blog images are optimized for Pinterest.
Create eye-catching Pinterest images using design templates. For design tips, read how to design Pinterest pins that drive traffic.
You also want to optimize the pin description so it includes keywords. When someone saves your image to Pinterest, it uses the SEO meta description from your blog post (not the image alt text). So make sure your post’s meta description is optimized for both Google and Pinterest searches.
Want pins that actually earn the click?
Adding a save button is step one. Designing pins people want to save is step two, and it’s where most course creators get stuck staring at a blank Canva canvas.
If you want to skip that part, my Pinterest pin templates are built specifically for promoting blog posts, lead magnets, and evergreen webinars, in 4 coordinated design styles. Drop in your text, swap the image, schedule, done.
Pinterest is one of the few marketing channels that keeps sending traffic long after you stop posting, which is why it’s worth the upfront design effort.
