Skip to content

Instantly share code, notes, and snippets.

@joe-dempsey
Last active March 20, 2026 05:54
Show Gist options
  • Select an option

  • Save joe-dempsey/3b7fc7109a07c633c7fd5da22d5d462e to your computer and use it in GitHub Desktop.

Select an option

Save joe-dempsey/3b7fc7109a07c633c7fd5da22d5d462e to your computer and use it in GitHub Desktop.
Shopify product richsnippet - structured data markup for Shopify product templates
{% assign current_variant = product.selected_or_first_available_variant %}
<div id="richsnippet">
<div itemscope itemtype="http://schema.org/Product">
<meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
<meta itemprop="image" content="{{ product.featured_image.src | img_url: 'grande' }}">
<meta itemprop="name" content="{{ product.title | escape }}">
<meta itemprop="description" content="{{ product.description | strip_html }}">
{% if product.vendor %}<meta itemprop="brand" content="{{ product.vendor }}">{% endif %}
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<meta itemprop="price" content="{{ current_variant.price | money_without_currency }}">
<link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">
<meta itemprop="seller" content="{{ shop.domain }}">
<meta itemprop="itemcondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition" />
</div>
</div>
</div>
@henrybarn
Copy link
Copy Markdown

Most Shopify sites are using canonical URLs today. Should product.selected_or_first_available_variant actually be product.first_available_variant since search engine links will only land on the first variant. The canonical URLs say shopifysite.com/products/product-handle and shopifysite.com/products/product-handle?variant=800 are the same result.

@toledox82
Copy link
Copy Markdown

toledox82 commented Apr 20, 2018

If the price is above 999, it will cause warning on testing tool, so need to add this string filter remove: ","

This line 14 will be:
<meta itemprop="price" content ="{{current_variant.price | money_without_currency | remove: ","}}">

@joe-dempsey
Copy link
Copy Markdown
Author

joe-dempsey commented May 1, 2018

product.first_available_variant and product.selected_or_first_available_variant will return the same for google bot - assign either.

I'd actually use a remove/replace function to format currencies which use a comma if google don't like that.

{{ current_variant.price | money_without_currency | remove: "." | replace: ',', '.' }}

most countries use the decimal - but easy to modify - this is just a guide

@joe-dempsey
Copy link
Copy Markdown
Author

joe-dempsey commented Nov 21, 2018

one addition is
<meta itemprop="itemcondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/NewCondition" />

@rkvisai
Copy link
Copy Markdown

rkvisai commented Jul 19, 2019

I'm still getting warnings for missing SKU

@Spika-SEO
Copy link
Copy Markdown

Note the Google prefers JSON and not itemprop

@neetugw
Copy link
Copy Markdown

neetugw commented Dec 29, 2024

Read the full article on richsnippets for Shopify here.

@bloomagencymumbai
Copy link
Copy Markdown

bloomagencymumbai commented Jun 10, 2025

@iamsnehag
Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment