How to add Schema Markup to Shopify

Published:

Last updated:

how to add schema markup to shopify
Home » Articles » Shopify » How to add Schema Markup to Shopify

What is Schema?

Schema markup is like a secret language for your website that helps search engines understand what your content is all about. If you’re running an online store with Shopify, adding this special code can be a game-changer.

Imagine you’re searching for a product online. You want to see details like price, reviews, and if it’s in stock. Schema markup makes sure all that info pops up right there in the search results. By adding schema markup into your Shopify store, you’re basically giving search engines all the information they need to find and showcase your products, rather than making them dig through your entire product page. When more people can see what you’re selling, it’s like opening the floodgates to more potential customers and, hopefully, more sales.

So, are you already using schema markup on your Shopify store? If not, don’t worry. Our article will guide you through the process step by step, making it as easy as pie.

The types of Schema Markup that should be added to Shopify

To get more customers to click on your Shopify site, focus on adding special codes (schema markup) to your most important pages. Here are the five key pages and the types of schema markup you should use:

Product Pages

  • Schema Markup: Product, Review, AggregateRating
  • Why: These pages show details about your products. The special codes help display info like price, availability, and reviews right in the search results, catching people’s eyes and making them more likely to click.

Category Pages

  • Schema Markup: Breadcrumb
  • Why: This code helps show the path or location of pages on your site in the search results. It makes it easier for customers to understand your site layout and find products faster.

Blog Pages

  • Schema Markup: Article
  • Why: Blog posts can boost your site’s visibility on search engines and offer valuable info to customers. This code makes your blog posts stand out in search results with details like title, author, and publication date.

Homepage

  • Schema Markup: Organization
  • Why: This code gives info about your business, like name, address, phone number, and logo. It helps build trust and credibility for your store.

FAQ Pages

  • Schema Markup: FAQ
  • Why: This code helps common questions and answers show up directly in search results. It provides quick info and attracts customers to click on your page to learn more.

How to add Schema to your Shopify website

It’s not complicated adding schema markup to your Shopify. You can do it manually or you can use a third-party Shopify app. Let’s start with the manual approach first.

Add schema code to your site manually

Step 1: Access theme files

  • Log in to your Shopify admin panel.
  • Navigate to “Online Store” and then “Themes.”
  • Click on “Actions” and select “Edit code” to access the theme files.

Step 2: Locate .liquid template

In this step, you have to find the right .liquid template in your Shopify theme where you want to add the Schema markup.

This can include files like the main theme file, a product page template, a collection page template, and so on.

Step 3: Create JSON-LD Schema Markup

Next, you can use Google’s Structured Data Markup Helper to create Schema markup using the JSON-LD format.

Step 4: Validate Schema Markup

Make sure your Schema markup is error-free by checking it with tools like Google’s Structured Data Testing Tool or Schema Markup Validator. This helps ensure that your structured data is correctly formatted and ready for search engines to understand.

the homescreen of schema markup validator

Step 5: Add Schema to Liquid Template

Last but not least, place the JSON-LD Schema markup in the right spot in your chosen Liquid template. Typically, this involves adding it in either the header or body section, depending on the type of Schema markup you are using.

Sample of JSON-LD Schema Markup

To assist your work, feel free to copy and use the sample schema markup for each type.

Schema Markup: Product

{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Example Product",
  "description": "This is an example product description",
  "sku": "12345",
  "brand": {
    "@type": "Brand",
    "name": "Example Brand"
  },
  "offers": {
    "@type": "Offer",
    "price": "100.00",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock"
  }
}

Schema Markup: Review

{
  "@context": "https://schema.org",
  "@type": "Review",
  "itemReviewed": {
    "@type": "Product",
    "name": "Example Product"
  },
  "reviewRating": {
    "@type": "Rating",
    "ratingValue": "4",
    "bestRating": "5"
  },
  "author": {
    "@type": "Person",
    "name": "John Doe"
  },
  "reviewBody": "This is a sample review."
}

Schema Markup: AggregateRating

{
  "@context": "https://schema.org",
  "@type": "AggregateRating",
  "itemReviewed": {
    "@type": "Product",
    "name": "Example Product"
  },
  "ratingValue": "4.5",
  "bestRating": "5",
  "worstRating": "1",
  "ratingCount": "100",
  "reviewCount": "50"
}

Schema Markup: Breadcrumb

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://example.com/home"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Category",
      "item": "https://example.com/category"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Subcategory",
      "item": "https://example.com/subcategory"
    }
  ]
}

Schema Markup: Article

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Article Headline",
  "datePublished": "2022-01-01",
  "author": {
    "@type": "Person",
    "name": "Jane Doe"
  },
  "publisher": {
    "@type": "Organization",
    "name": "Example Publisher",
    "logo": "https://example.com/logo.png"
  }
}

Schema Markup: Organization

{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "Example Organization",
  "url": "https://example.com",
  "logo": "https://example.com/logo.png",
  "contactPoint": {
    "@type": "ContactPoint",
    "telephone": "+123456789",
    "contactType": "customer service"
  }
}

Schema Markup: FAQ

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What is a FAQ?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "FAQ stands for Frequently Asked Questions."
      }
    },
    {
      "@type": "Question",
      "name": "How to use FAQ schema?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "You can use FAQ schema to provide structured data for frequently asked questions on your website."
      }
    }
  ]
}

Using apps from Shopify store

Adding schema markup through an app in your Shopify store is super easy. Here’s a simple guide to do it:

  • Step 1: Log in to your Shopify dashboard.
  • Step 2: Go to the Shopify App Store. 

Step 3: Search for a schema markup app and install the one you like. Some options to consider are: 

Step 3: Once set up, the app will start adding schema markup to your store’s pages automatically. It would be a good idea to periodically check that the schema added is correct using the Schema validator tool from Google.

FAQ

If I add incorrect schema markup to my Shopify store, does it hurt SEO?

Incorrect schema markup can hurt your SEO. If search engines find mistakes in your markup, it can lead to penalties, showing incorrect details in search results, or even removing your store from special search features. Always follow the guidelines from schema.org and regularly check your schema to make sure it’s working properly and boosting your SEO.

I have an international shopify store. How do I add localised schema markup for different languages?

For stores with multiple languages, use hreflang tags to tell search engines about different language versions. Add schema markup that matches the localised content for each language. You can set up your Shopify store to generate the correct JSON-LD markup based on the user’s language settings or different subdomains for each region.

Contact Us