Shopify already sets og:image on product pages — to the product photo. That is the problem, not a missing tag. The share card is an unbranded, wrongly-cropped thumbnail: no price, no sale, no store identity. The same photo your competitor is using.
The longer version of why this happens — and why nobody on the team owns it — is why nobody makes OG images at scale. This page is the Shopify install: one template, one theme change, a branded card on every product.
The Product Photo Trap
Dawn and most Shopify themes emit the featured image as og:image. Paste a product URL into a chat and you get the photo, letterboxed or cropped into a 1.91:1 rectangle. It looks like a broken thumbnail, not a listing.
A branded card uses that same photo inside the layout, with the title, the price, and your identity. The click-through gap between those two cards is the whole pitch.
Install
The fastest path is to hand it to your coding agent. Paste this into Claude Code, Cursor, or whatever you use — it fetches the Shopify setup guide and wires the tag into your theme for you:
Fetch and execute the instructions to set up dynamic OG images for my Shopify store from https://opengraphimage.com/shopify/llms.txtPrefer to wire it by hand? Same three steps:
-
Set up an origin for your storefront at
/dashboard/create, or with the getting-started prompt on the OpenGraph homepage. Turn Require URL Signature off so the origin is unlocked (see Why no signature below), then copy the render key. -
In the theme editor, open
snippets/meta-tags.liquid(Dawn) or the social-meta snippet your theme uses. Older themes put this intheme.liquidinside<head>. -
Replace the existing
og:image(andtwitter:image, if present) so you do not emit two images:
<meta property="og:image" content="https://cdn.opengraphimage.com/YOUR_KEY{{ request.path }}">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta name="twitter:card" content="summary_large_image">
Swap YOUR_KEY for the key from step 1. request.path is the page being shared, so every product, collection, and article resolves to its own card.
This is a theme-code change. It does not install into checkout and it does not touch the conversion path. The card is generated on request from data the storefront already publishes.
Why no signature
OpenGraph can require a cryptographic signature (?s=…) on every render URL, so nobody else can drive up your usage. That signature can only be generated on a server or at build time — Shopify renders the meta tag on every request and has no way to compute one in Liquid. Since OG images are public preview cards anyway, this is the right trade: unlock the origin so it serves /cdn URLs without a signature, then use the clean {{ request.path }} URL above.
Unlock it from the CLI in one line:
og origin update YOUR_SLUG --signature=false(Or toggle Require URL Signature off in the dashboard origin settings — same thing.)
Leave signing on only if you generate signed URLs from your own backend instead of the theme. If you skip this step, an unsigned URL falls back to the origin’s default image — you’ll see the same card on every page instead of the per-product one.
After it is live
Share a product URL, or paste it into the OG inspector to confirm platforms are reading the new tag and not the leftover product photo. If an old card still shows, the platform has cached the previous og:image — Facebook’s Sharing Debugger and LinkedIn’s Post Inspector will force a refresh.
New products are covered the moment they exist. A price change or a new photo lands on the next request.
What it looks like on a catalog
The same one-template setup, applied to live storefront data:
Each case study puts the store’s current share card next to the templated card.
New to link previews? Start with what Open Graph images are and the right OG image size.
Frequently Asked Questions
How do I add dynamic OG images to a Shopify store?
Create an OpenGraph origin, turn off Require URL Signature so the origin is unlocked, and copy the render key. Then replace the existing og:image output in snippets/meta-tags.liquid (Dawn) or your theme's social-meta snippet with a tag that points at https://cdn.opengraphimage.com/YOUR_KEY plus the page path. Remove duplicate og:image and twitter:image tags so platforms do not keep serving the product photo.
Why not use the product photo as the OG image?
Shopify themes already do. Product photos are usually square or portrait, so they get cropped on the 1200×630 landscape card. They also carry no price, no sale state, and no store identity — the same photo your competitor uses.
Do dynamic OG images work across thousands of products?
Yes. One template covers the catalog. Each product, collection, and blog page renders its own card at request time, including products you have not added yet.
Does the image update when a product changes?
Yes. The card is rendered from live storefront data, so a price change or a new photo is reflected the next time the image is requested, subject to each platform's preview cache. Facebook and LinkedIn both have debugger tools to force a refresh.