Snug Gallery / Guides

Pinterest save button on Shopify gallery images

How Snug Gallery's Pinterest save button works: a plain link per tile, no Pinterest script, what gets pinned, and how captions become pin descriptions.

Pinterest is the one social network where a photo of a sofa in a sunlit room keeps sending visitors to the sofa's page two years after it was posted. Gallery pages are full of exactly that kind of photo, so letting shoppers pin them is an obvious move, and it is also where most galleries either load a third-party script on every page view or do nothing at all. Snug Gallery takes a third route: a small save button on each tile that is nothing more than a link. This guide explains what the button does, what ends up on Pinterest when someone uses it, why the implementation is deliberately plain, and how to write captions so the pins make sense when they travel.

Where the button lives and who sees it

The setting is a checkbox called Pinterest save button, under Extras on the gallery block in the theme editor. It is off by default and, like the other items in that group, it takes effect on the Standard and Unlimited plans; on the Free plan the checkbox is there but the tiles render without it. Because it is a block setting, it is per placement: a lookbook page can offer pinning while a product page gallery with the same images does not.

On the storefront, each tile gets a round red button in its top-left corner with the Pinterest logo. It is invisible until the shopper hovers over the tile, and it also appears when the button is reached with the keyboard, so it is not hidden from people who tab through the page. Its accessible name is Save to Pinterest. While a video in the gallery is playing, the button on that tile is hidden so it does not sit over the player controls.

Hover is a desktop idea. On a phone there is no hover state, and a tap on a tile does whatever the tile does, usually opening the lightbox or following the image's link, so the button is mainly a desktop and laptop feature. Shoppers on phones who want to pin generally use the share sheet in the Pinterest app, which works on any page and does not need a button from you.

What a pin contains

The button is a link to Pinterest's pin-creation address with three values filled in. The first is the page: the address of the page the gallery is on, which is what the pin will link back to. If the gallery sits on a product page, the pin leads to the product; if it sits on a dedicated gallery page, the pin leads there. The second is the image itself, requested from Shopify's image CDN at 1,600 pixels wide, which is more than enough for Pinterest to show the pin large and to keep it sharp if the pinner's board is viewed on a big screen. The third is the description, which is the image's caption title if you wrote one, or its alt text if you did not.

That last rule is the one worth acting on. Pinterest shows the description under the pin and uses it to decide which searches the pin appears in, so a tile captioned 'Linen duvet set in sage, styled with oak' travels much better than one whose alt text is 'IMG_4821' or, worse, nothing at all. Captions and alt text are both set in the gallery editor; if you have been captioning for the page, you have been writing pin descriptions already. If you have been relying on alt text for accessibility, that text is doing double duty and should describe the picture in words a shopper would search for.

Nothing else is sent. There is no board pre-selected, no account identifier, no tracking parameter of ours. When the shopper clicks, Pinterest opens in a new tab, asks them to pick a board (or to log in first), and creates the pin. Whether Pinterest also pulls richer data from the page, such as a price for a product page, depends on the page's own metadata and on your Pinterest account's rich pin setup, not on anything in the gallery.

Why it is a link and not the Pinterest script

Pinterest's own widget, the one most sites use for hover buttons, is a script that loads from Pinterest on every page view, scans the page for images, and injects a button onto each. It works, and it is free, but it costs every visitor a third-party request and some main-thread time whether or not they have ever heard of Pinterest, and it means Pinterest can see every page view on your gallery pages, not just the ones that end in a pin.

Snug Gallery's button is static HTML produced by the theme block when the page is rendered. There is no script to download, nothing runs until a shopper clicks, and until that click Pinterest learns nothing about the visit. It is the same decision the app makes everywhere else about the storefront, described in why a gallery app should not depend on third-party scripts: the gallery must draw and keep drawing without anyone else's server, and the three things that do reach outside Shopify, the photo submission form, videos by URL and this button, all wait for the shopper to act. For page speed the button is a rounding error: a few bytes of markup per tile and an inline icon.

The link also opens in a new tab with the attributes that stop the new page from reaching back into yours and that tell search engines the link is not an endorsement. Your gallery page stays open behind the Pinterest tab, which is what you want; a shopper who pins and comes back is still shopping.

How the button gets along with the rest of the tile

A gallery tile can be several things at once: an image that opens a lightbox, an image that links to a collection or page, a photo with shop-the-look pins on it. The save button sits in its own layer above the image and outside the tile's link, so clicking it never opens the lightbox or follows the link, and clicking elsewhere on the tile never pins. The same separation is what keeps product pins and image links from fighting, which clickable gallery images goes into.

Two settings on the block pull in opposite directions and are often asked about together. Discourage right-click saving puts a stop to the browser's context menu on the gallery; the Pinterest button invites saving, with attribution and a link back. Having both on is not a contradiction, because a pin sends traffic to you while a downloaded file does not, but it is a choice to make deliberately, and the trade-offs are set out in protecting gallery images from right-click. Brands that want their images to travel only with a link back tend to turn both on; brands that want them to travel freely leave the protection off.

If the gallery shows customer photos, the button appears on those tiles too, and the description is whatever caption title or alt text the approved photo carries. Decide whether you want shoppers' photos pinned from your page before switching the button on for a customer-photo gallery; the consent text on your submission form should say what you intend to do with the photos, and 'display them on our site' and 'let visitors pin them' are not quite the same thing.

Writing captions that work as pins

Because the caption title is the pin description, a few habits pay off twice: once on the page and once on Pinterest. Lead with what the thing is, in the words a shopper would type: the product category, the material, the colour. Add the room, the season or the occasion if the photo shows one, because Pinterest searches are full of 'small bathroom', 'autumn table' and 'wedding guest'. Keep it under about a hundred characters so it is not truncated under the pin. Skip hashtags and emoji; they do nothing on your page and little on Pinterest.

Avoid captions that only make sense in sequence. 'Same set, from the other side' reads fine as the third tile in a row and means nothing on a board next to someone else's kitchen. Each caption should stand alone, which is good discipline for the page as well, since filters and sorting mean shoppers rarely see your tiles in the order you uploaded them; see gallery sort order for how that order is decided.

If a tile has no caption and no alt text, the description is blank and Pinterest will ask the pinner to write one, or will take whatever text is nearby. Most pinners type nothing. Give every image at least alt text; it is required for accessibility anyway, and it is the floor the pin falls back to.

Measuring what comes back

The pin links to your page, so visits from it show in Shopify's analytics and in Google Analytics as referrals from pinterest.com, the same way visits from any pinned image would. The gallery does not add campaign parameters to the pin's link; if it did, every pin of the same page would create a separate address, which fragments the page's history on Pinterest and can confuse search engines that see the gallery page at ten addresses. Rely on the referrer instead.

If you claim your website in Pinterest's business settings, Pinterest's own analytics show which of your pages are being pinned and how pins from your domain perform, including pins other people made from the same images. That report is the honest measure of whether the button earns its place: the button lowers the effort of pinning for people who were going to pin anyway, and it reminds people who were not thinking of it that they could. On gallery pages full of lifestyle photography that is usually a meaningful number; on a grid of packshots on white it may not be.

The button is one checkbox, so try it for a season on the pages where photos have a life of their own, lookbooks, room sets, customer photos, and watch the referral line. Snug Gallery keeps it out of the way until a shopper wants it, and out of your page weight entirely.

Frequently asked questions

Does the Pinterest save button load a Pinterest script on my Shopify store?

No. Snug Gallery renders the button as a plain link in the page's HTML when the gallery is drawn. Nothing is downloaded from Pinterest and nothing runs until a shopper clicks it, at which point Pinterest opens in a new tab to create the pin. Until that click, Pinterest learns nothing about the visit.

What text does a pin from my gallery get?

The pin's description is the image's caption title if you wrote one, otherwise its alt text. The pin links back to the page the gallery is on and uses a 1,600 pixel wide rendition of the image. Write captions that name the product, material and colour in words shoppers search for, and give every image alt text so there is always something to fall back to.

Why do I not see the Pinterest button on my gallery?

Check three things: the Pinterest save button checkbox is on for that specific gallery block in the theme editor, your store is on the Standard or Unlimited plan since the Free plan renders tiles without it, and you are hovering over a tile on a desktop browser, because the button appears on hover or keyboard focus rather than permanently.

Can shoppers pin images when right-click saving is discouraged?

Yes. The two settings are independent. Discourage right-click saving blocks the browser's context menu on the gallery, while the Pinterest button creates a pin that links back to your page with attribution. Many brands turn on both so their images travel with a link rather than as anonymous downloads.

More guides