Pinterest Save Button & Widget Code Generator

Q: How do I add a Pinterest Save button to my website?

Paste Pinterest's script once, near the end of each page: <script async defer data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script> . Every picture larger than 119 px then gets a Save button when the mouse is over it. For one button in a set place, choose "One button" above and copy that code too.

Pinterest's own Save button, Follow button and widget code, explained.

What to add

Where it shows

The page the pin links to

The picture's address

The pin's description

Button options

Round Large Say "Pin It" No sticky buttons

Your code

Your Save button code: on every picture, on hover

<script async defer data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>

What each part does

data-pin-hover="true" A Save button on each picture of the page when the mouse is over it. Pinterest's own code shows it only on pictures more than 119 px wide and tall. Pinterest's widget source on GitHub (pinterest/widgets, pinit_main.js, 15 March 2021)

The code is Pinterest's: its script draws every button and widget from Pinterest. Paste the script once per page, however many buttons and widgets it has (our advice). Checked 2 October 2026.

Quick answer: to put a Pinterest Save button on your site, paste Pinterest's script once, near the end of the page: <script async defer data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>. That one line puts a Save button on every picture when the mouse is over it. For a button in one place, a Follow button, or a pin, board or profile shown on your page, pick it above and copy the code: it is Pinterest's own code, with each part explained and a live preview drawn by Pinterest.

How to use it

Pick what to add: a Save button, a Follow button, or a pin, board or profile widget.
Fill in its box: your username, a board's or a pin's link, or for a one-picture Save button the page, the picture and a description.
Copy the code and paste it where the button or widget should appear. The <script> line is the same for all of them: one per page is enough.
Tap "Show the live preview" to see it drawn by Pinterest before you paste.

The Save button, three ways

On every picture, on hover. data-pin-hover="true" on the script tag. Pinterest's own code (its widget source on GitHub) shows the button only on pictures more than 119 px wide and tall, so icons and small thumbnails stay clean. To keep one picture out, give its <img> the attribute data-pin-nopin="true", which Pinterest's code also reads.
One button for any picture. data-pin-do="buttonBookmark": a tap lets the reader choose which picture on the page to save.
One button for one picture. data-pin-do="buttonPin" with the page, the picture and the description in its link, so the pin is the one you chose, with the words you wrote. Write the description the way you would for a pin; our pin title & description checker checks it against Pinterest's limits.

Pinterest's own notes in its widgets README: Breaking change, 10/9/2017: pin create buttons default to Save in the user's language (or English, if we don't support the user's language) instead of "Pin It." If you need Pin It buttons back, please set data-pin-save="false" in your initial call to pinit.js.

Follow button and widgets

Follow button (buttonFollow): a link to your profile; the words inside it are the name the button shows. Pinterest's script turns it into its own Follow button, drawn from Pinterest. We never host or redraw Pinterest's logo.
Pin widget (embedPin): one pin on your page. Pinterest's code draws it small (237 px), medium (345 px) or large (600 px).
Board and profile widgets (embedBoard, embedUser): a grid of pins. Leave the width out and the grid fills the space it sits in; Pinterest's code ignores a width wider than that space. The picture width sets the number of columns, between 60 and 237 px.

Adding it in WordPress

Paste the <script> line once into your site's footer: your theme's footer or code setting, or a plugin that adds code to the header and footer.
Paste the button or widget line into a Custom HTML block where it should appear, in a post, a page or a widget area.
Check the page while logged out. Some caching and script-optimising plugins delay or combine scripts; if the button doesn't appear, exclude pinit.js from them.

To make the pins your Save buttons create look right, size your pictures for Pinterest with our Pinterest image size checker.

FAQ

How do I add a Pinterest Save button to my website?

Paste Pinterest's script once, near the end of each page: <script async defer data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>. Every picture larger than 119 px then gets a Save button when the mouse is over it. For one button in a set place, choose "One button" above and copy that code too.

How do I embed a Pinterest board on my website?

Choose "Board widget", paste the board's link, and copy the code. Leave the width out to fill the space it sits in, or set a width, a height and a picture width; the picture width decides the number of columns.

Is there a Pinterest Follow button for websites?

Yes. Choose "Follow button", type your username and the name to show, and copy the code. Pinterest's script draws the button from Pinterest, so it always looks the way Pinterest makes it.

Why does my Pinterest button not show up?

The usual reasons are the script missing or blocked (by a caching or script-optimising plugin, or a reader's ad blocker), the button code pasted where your editor strips it out (use a Custom HTML block), or a picture too small for the hover button: Pinterest's code skips pictures 119 px or smaller.

Does Pinterest have a WordPress plugin for the Save button?

You don't need one: the script line and a Custom HTML block do the job, as above. Many WordPress plugins wrap the same Pinterest code; whichever you use, the button is drawn by Pinterest's script.