Adding and linking custom structured data to JSON-LD for SEO

While JSON-LD for SEO tries to supply a complete set of data for all Shopify stores, sometimes you might need to supplement its data with something custom.

For new types of structured data, you can just add them anywhere in your Shopify theme and they'll work. JSON-LD is flexible like that.

If you want to modify the data types JSON-LD for SEO provides, here's how to do it.

1. Create a new block of JSON data

The first step is to create a new block of JSON data that you want to add. I like to write this in a text file so you can copy and paste it where it goes.

Let's say you want to add a field for the color and material of your product. We'll code that up like this

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Product",
"color": "red",
"material": "silk"
}
</script>

Adding that to the Schema Markup Validator shows that it works but it's not connecting to any other sets of data.

2. Link the data to JSON-LD for SEO

Now that you have the data you want to add, you need to link it to the main data. This uses the @id field and is what the LD part of JSON-LD means (Linked Data).

JSON-LD for SEO uses your product url as the @id with a suffix of #json-ld-for-seo. You can easily find the current @id by using Schema Markup Validator tool.

Adding the same @id to our data, we have this:

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Product",
"@id": "https://json-ld-for-seo-demo.myshopify.com/products/aerodynamic-aluminum-bench#json-ld-for-seo",
"color": "red",
"material": "silk"
}
</script>

Some fields like color and material can only be applied at the product level.

We also now include a variant @id so that you can link custom data at the variant level. For variants, JSON-LD for SEO uses your product URL with the variant number in the @id with a suffix of #json-ld-for-seo-variant.

Using the variant @id, you can add custom data specific only to that variant. Let's say you're doing preorders and want to add an availability date for a specific variant.

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Offer",
"@id": "https://json-ld-for-seo-demo.myshopify.com/products/aerodynamic-aluminum-bench?variant=36298357769#json-ld-for-seo-variant",
"availabilityStarts": "2024-01-21"
}
</script>

Local Business

Let's say you want to add custom structured data about a specific store location. The following is an example where the location is not the same as the main address associated with your Shopify account. Notice I use a different @id as #local. I made up the id so that it wouldn't try to mix with the other org data.

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LocalBusiness",
  "@id": "https://json-ld-for-seo-demo.myshopify.com/pages/hq#org",
  "department": [ 
    {
    "@context": "https://schema.org",
    "@type": "LocalBusiness",
    "@id": "https://json-ld-for-seo-demo.myshopify.com/pages/hq#local",
    "logo": "https://cdn.shopify.com...",
    "image": "https://cdn.shopify.com...",
    "name": "JSON-LD for SEO HQ",
    "telephone": "123456789",
    "address": {
        "@type": "PostalAddress",
        "streetAddress": "123 SE Main St",
        "addressLocality": "Portland",
        "addressRegion": "",
        "postalCode": "97127",
        "addressCountry": "US"
    },
    "openingHoursSpecification": [
        {
            "@type": "OpeningHoursSpecification",
            "dayOfWeek": ["Monday", "Wednesday"],
            "opens": "14:00",
            "closes": "18:00"
        },
        {
            "@type": "OpeningHoursSpecification",
            "dayOfWeek": "Sunday",
            "opens": "11:00",
            "closes": "15:00"
        }
      ]
    }	
  ]   
}
</script>

3. Adding the new JSON-LD data to the Shopify theme

The last step is to add that new block of data to your theme.

You'll want to put it into different places depending on what data you're adding.

Adding data for a specific product, blog post, or page? Add the script into the description using Shopify's editor in HTML mode.

Adding data for all products? You'll want to add the script to your product template in Shopify's theme editor.

Adding data for every page? Add the script to your theme's layout template.

One important note for customers using the old snippet version of JSON-LD for SEO:

Do not modify JSON-LD for SEO's snippet directly. Doing so will cause your changes to be lost on the next update. That's why there's a big ol' warning at the top of the file.

List of IDs

To help you out, here's a list of the IDs used by the major data types.

• Organization/Store/Local Business - your store url with the suffix of #org.
• Website - your store url with the suffix of #website.
• Product - your product's canonical url with the suffix of #json-ld-for-seo.
• Variant - your variant url with the suffix of #json-ld-for-seo-variant.
• Blog posts - your blog post's canonical url with the suffix of #article.
• Shopify pages - your page's canonical url with the suffix of #article.
• Videos - your page's canonical url with the suffix of #video.
• Recipes - your page's canonical url with the suffix of #recipe.
• FAQs - your page's canonical url with the suffix of #faq.
• How-To - your page's canonical url with the suffix of #howto.

That's it. That's the entire process to add custom JSON-LD structured data to your Shopify store by piggybacking on JSON-LD for SEO.