Shopify Open Graph tags for AI shopping agents

When ChatGPT cites your store in a response, when Perplexity drops a Shopping card, when a customer pastes your URL into Slack, when an LLM-powered Twitter client unfurls your link in a thread — the title, description, and preview image they all show comes from three meta tags in your homepage <head>: og:title, og:description, og:image. Default Shopify themes emit them correctly on product pages, where they're driven from the product object. The homepage is the gap — most themes leave the home <head> with one or zero of the three. Result: the most-linked URL on your store renders as a bare hostname instead of a branded card.

Last updated 2026-04-30 · Floor signal · 15 pts

15 / 100Floor signal weight

5 ptsPer tag (partial credit)

3 linesOf theme.liquid to fix

What this signal scores: the presence of og:title, og:description, and og:image meta tags in the <head> of https://yourstore.com/. Each tag = 5 pts. All three present = 15 pts. og:image additionally requires a fetchable URL returning a valid image at least 600 px on the long edge — if the image 404s the tag scores zero on that subcheck.

What it is

The Open Graph protocol is a Facebook-originated convention from 2010 that has become the universal standard for how a URL renders when shared into another surface. AI shopping agents, social platforms, messaging clients, search engines, browser previews — all of them parse the same three tags. The bare minimum:

og:title The headline that appears at the top of the rendered card. Distinct from the HTML <title> tag — that's for the browser tab; this is for everyone else. og:description One-to-two-sentence summary that appears below the title. 150-200 chars is the sweet spot — agents truncate longer at varying breakpoints. og:image The image rendered alongside title and description. Recommended 1200×630 (the 1.91:1 Facebook/X ratio); minimum 600 px on the long edge for any major platform to render the rich preview at all.

Two strong-but-optional additions worth shipping with the core three: og:url (the canonical URL — important when query strings vary across crawls), and og:type (set to website on the homepage; the relevant value is product on PDPs). Twitter/X also reads twin tags: twitter:card, twitter:title, twitter:description, twitter:image — Twitter falls back to OG tags if the twin set is missing, so don't double-emit if the OG tags are right.

The four shapes Shopify homepages actually emit

Bad — 0 pts

Empty head

<head>
  <title>Store</title>
  ...
  <!-- no og:* -->
</head>

Partial — 5 pts

Title only

<meta property="og:title" content="Allbirds">
<!-- no description -->
<!-- no image -->

Partial — 10 pts

Title + image, no description

<meta property="og:title" content="Allbirds">
<meta property="og:image" content="https://...">
<!-- no description -->

Correct — 15 pts

Full set

<meta property="og:title" content="Allbirds — natural shoes">
<meta property="og:description" content="Comfortable shoes from natural materials...">
<meta property="og:image" content="https://cdn.allbirds.com/og.jpg">
<meta property="og:url" content="https://www.allbirds.com/">
<meta property="og:type" content="website">

The most common partial we see in scans is the title-only homepage — themes inherit a default og:title from {% raw %}{{ shop.name }}{% endraw %} but never inherit a description or image. The fix lifts you from 5/15 to 15/15 in one edit.

Why AI shopping agents care

Citation rendering. When ChatGPT or Perplexity cites your store in a Shopping answer, it uses your OG tags for the inline preview card. A bare hostname citation has materially lower click-through than a card with brand image, headline, and one-line value prop. The OG tags are the difference between an AI surfacing your store with a rich preview and surfacing your store as a low-information link.
Rich snippet primacy on the homepage. AI agents tend to look at the homepage as the canonical "what is this store" entry. JSON-LD on PDPs answers product questions; OG on the homepage answers "what does this brand sell, and why should I trust them." Missing OG and the agent has to fall back to scraping the page body — slower, lower-confidence, and a downweight in tied ranking decisions.
Cross-channel consistency. The same OG block drives Slack unfurls, iMessage rich previews, X cards, LinkedIn share cards, Discord embeds. Every channel that previews your homepage URL uses the same three tags. Fixing the homepage OG once lifts every channel at once.
Trust priming for unknown brands. AI rankers give a "this is a real, well-maintained store" prior to homepages with intentional OG metadata. The signal is small in isolation; combined with sitemap, JSON-LD, and a public product feed it builds a "well-tended" composite that lifts you in tied decisions against equally-priced competitors with weaker hygiene.

How to test it on your store

Open https://yourstore.com/ in a browser. View source.
Search for og:title. If missing — 0 credit on that tag. If present, copy the content value and verify it's not a generic placeholder ("My Store," "Online store").
Repeat for og:description and og:image.
For og:image: open the URL in a new tab. It must load (200 OK) and be at least 600 px on the long edge. A broken image 404 scores zero on that tag even though the meta tag exists.
Cross-check on a real consumer surface: run opengraph.xyz or paste your URL into Slack and see how it renders. If the preview is empty or shows a stretched logo, the OG block needs work.

Free CatalogScan scan does the three-tag check plus a deep-fetch on the image to confirm it loads and meets minimum size — so you don't get bitten by the "tag exists, image broken" footgun.

How to fix it

Add the three tags to layout/theme.liquid5 minfree

In the Shopify theme editor, open layout/theme.liquid. In the <head> block, add:

<meta property="og:type" content="{% raw %}{% if request.page_type == 'product' %}product{% else %}website{% endif %}{% endraw %}">
<meta property="og:url" content="{% raw %}{{ canonical_url }}{% endraw %}">
<meta property="og:title" content="{% raw %}{{ page_title | default: shop.name | escape }}{% endraw %}">
<meta property="og:description" content="{% raw %}{{ page_description | default: shop.description | default: shop.name | escape }}{% endraw %}">
<meta property="og:image" content="{% raw %}{{ shop.url }}{{ 'og-default.jpg' | asset_url }}{% endraw %}">

This emits the right shape on every page type — product pages get the product image and product description, the homepage gets your shop.description and a default OG image you upload to assets/og-default.jpg. One file, all pages fixed.

Set shop.description and upload a default image5 minfree

Admin → Online Store → Preferences. Set the Title and Meta description — these populate {% raw %}{{ shop.name }}{% endraw %} and {% raw %}{{ shop.description }}{% endraw %} in Liquid. Upload og-default.jpg (1200×630, your logo on a branded background) to Files or directly into assets/ in the theme editor.

Hydrogen / Next.js: emit OG from your root layout15 minfree

Hydrogen: in app/root.tsx's meta export, return the OG tags from your shop config. Next.js 13+ App Router: export metadata from app/layout.tsx with openGraph: {`{ title, description, images, url, type: 'website' }`}. Both frameworks emit them as standard <meta> tags on render. For per-product overrides, override metadata in the product route.

CatalogScan Pro: theme-aware patcher2 min$49/mo

Pro detects which OG tags your theme is currently emitting (and the surface — homepage vs. PDP) and emits a Liquid patch you can paste into layout/theme.liquid. Includes a default OG image generated from your brand palette + logo if you don't already have one. See Pro pricing.

5 mistakes we keep finding

1. Tags emitted on PDPs but not on the homepage

Most Shopify themes have OG tags wrapped in a conditional that only fires on product pages. On the homepage and collection pages, the head is empty. Test the homepage specifically — it's the one that matters most for citation rendering.

2. `og:image` set to a 200×200 favicon

Some themes default og:image to {% raw %}{{ shop.brand.square_logo }}{% endraw %} which is a 200-pixel logo asset. Below the 600-pixel-long-edge minimum, most platforms reject the image and render no preview. Upload a 1200×630 dedicated OG image and reference it explicitly.

3. Image URL is relative, not absolute

<meta property="og:image" content="/og.jpg"> — relative paths fail because OG parsers don't know what host to combine with. Use the full https:// URL. The Shopify Liquid {% raw %}{{ ... | asset_url }}{% endraw %} filter emits the absolute CDN URL by default, but custom snippets that hardcode /og.jpg are a common footgun.

4. `og:title` is the placeholder "My Store"

Brand-new Shopify stores ship with the placeholder shop name "My Store" until the owner sets it under Preferences. If the OG block is wired to {% raw %}{{ shop.name }}{% endraw %} and the shop name is still "My Store," your OG title is "My Store." Set the real shop name first, then verify the OG.

5. App-injected duplicate tags

SEO apps (Smart SEO, Plug In SEO, etc.) sometimes inject their own OG tags on top of theme-emitted ones. Result: two og:title tags, two images, parsers pick whichever is first or last and your intended block is ignored. Pick one source — either the theme or the app — and disable OG emission in the other.

How does your homepage render in ChatGPT?

Free 2-minute scan. We fetch your homepage <head>, parse all three OG tags, fetch the image to verify size, and score against 14 other AI-shopping signals.

Scan my store → See all 15 signals