Last update on .

Don't forget to share this post

Are you making schema markups one by one and wish there was an easier way? Are you fed up with using plugins that create the same schema on every page? Do you want each page to have its own unique schema but don't know how to automate the process? Do you want to learn how to apply structured data on scale?

If you're interested in learning ontology and structured data for semantic SEO, as well as how to create dynamic schema markups, I'm currently building a course on these topics. Join my waiting list to be the first to know when it becomes available!

If you have a large website with thousands of pages, and you want to add dynamic markups to all of them, you're in the right place! we're going to explore the world of dynamic schema markups. We'll take a look at how they can be tailored for each page of your website, without the hassle of manual input. And how to uniquely customize them for each webpage dynamically, bypassing the time-consuming manual process. Say goodbye to generic schema and say hello to a streamlined, efficient process that not only saves you time but also enhances your website's SEO potential. Let's dive in and uncover the secrets of applying dynamic structured data on a grand scale!

The problem is that you want to apply unique structured data to your entire website, but you have a large amount of web pages.

The solution is to add schema to any number of pages with just one piece of dynamic code.

This guide will show you how to create dynamic schema markups and automate the process on scale.

Let’s start

Install the Required Tools

Here are the tools required tools for this tutorial

Google Tag Manager: Create an account with Google Tag Manager. Following the creation of your account, it is necessary to install the provided GTM code across all pages on your website. This is a crucial step to ensure proper schema installation and management.

Google Tag Manager

SelectorGadget: Selector Gadget is an open source Chrome Extension that makes CSS selector generation and discovery on complicated sites a breeze. There is a tutorial video and a bookmarklet version available at


In case you are building knowledge graphs and semantic schema networks, use the following recommended tool.

Suggested Tools

If you are familiar with network theory and you would like to create markups on an advanced level, by building knowledge graphs and semantic schema networks, you can use this tool. In case you dont know how to, and you want to learn structured data for semantic SEO sign up for my course.

Schemantra: If you don't have your structured data set up yet, consider using Schemantra. This unique tool, designed for semantic SEO, combines the functions of a schema generator and an ontology constructor.

Schemantra lets you define your primary entity and its relations on the page, providing search engines with a clear understanding of your site and removing any ambiguities. Simply put, Schemantra puts you in charge of illustrating your site's semantic blueprint.


Now that all the required and the recommended tools are ready let’s start by identifying what kind of schema markups we need to describe our page.

Identify the Schema Types That You Want to Implement and Their Required Properties

When deciding on the type of schema markup to implement, you should first identify the type of schema that represents the content on your page. Here's a step-by-step guide:

  • Identify Your Content Type: Analyze your website and understand what kind of content you have. It could be articles, products, recipes, events, etc.
  • Check Look for the schema type that best matches your content. For instance, if you are a book retailer, you might use the 'Book' schema. Here is a comprehensive list of all schema types.

Having identified the schema type we wish to implement on your website, the next step is to create the corresponding schema template.

Create a Schema Template

A schema template is a structured data model that you create to represent the type of data you wish to mark up on your website. This template is a blueprint that can be repeatedly used for similar types of content, making the markup process easier and more efficient. Once you have identified what type of schema is needed and its required properties.

JSON_LD Code Example for a BreadcrumbList

  • Build the Template: Go to Schemantra to generate any type of schema needed to describe your page.
  • Test the Template for errors: Use a tool such as Schema Validator Tool to make sure your template doesn't have any errors.
  • Test the template for the required and recommended properties: Use a tool such as Google’s Structured Data Testing Tool to make sure your template matches the required and the recommended properties for rich results of featured snippets.

Remember that each type of content will have its own specific schema, so you might need to create several different templates if your site has diverse content.

In this example, the schema template defines a BreadcrumbList schema using the JSON-LD format. It includes the following properties: name and item

JSON_LD Code Example for a BreadcrumbList

<script type=”application/ld+json”>
    "@type": "BreadcrumbList",
    "itemListElement": [
        "@type": "ListItem",
        "position": "1",
        "name": "Home",
        "item": ""
        "@type": "ListItem",
        "position": "2",
        "name": "Complete List of Schemas",
        "item": ""
        "@type": "ListItem",
        "position": "3",
        "name": "Accommodation",
        "item": ""

After successfully creating the schema template, the next step is ensuring our schema accurately represents the content of every page. To do that we have to identify the dynamic content.

Identify Dynamic Content

To identify the properties that you would like to be replaced dynamically, consider your content and identify the elements that change for each instance. In this example, if you are creating a template for a BreadcrumbList schema, properties like 'name',and ‘item’ would likely be different for each list item and therefore should be replaced dynamically.

Dynamic Content Marked

<script type=”application/ld+json”>
"@context": "",
"@type": "BreadcrumbList",
  "itemListElement": [{
    "@type": "ListItem",
    "position": 1,
    "name": "",
    "item": ""
    "@type": "ListItem",
    "position": 2,
    "name": "",
    "item": ""
    "@type": "ListItem",
    "position": 3,
    "name": "",
    "item": ""

Now that the dynamic content is identified we have to turn these values into variables.

Transform Values into Variables

Inserting variables for schema in Google Tag Manager allows for dynamic and personalized schema markups for each page. Variables act as placeholders for data that is dynamically injected into the schema markup.

Values to Variables

To do this, substitute each blank property with a suitably named variable. Select variable names that best resonate with their function or purpose. Encase these variables within double curly braces, as this is the standard syntax Google Tag Manager uses to identify variables.

<script type=”application/ld+json”> { "@context": "", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "{{first_bread_crumb}}", "item": "{{first_bread_crumb_url}}" },{ "@type": "ListItem", "position": 2, "name": "{{second_bread_crumb}}", "item": "{{second_bread_crumb_url}}" },{ "@type": "ListItem", "position": 3, "name": "{{third_bread_crumb}}", "item": "{{third_bread_crumb_url}}" }] } </script> 

Note that, it's recommended to generate your BreadcrumbList schema template to the depth of your most nested page level. This is because, if a value is absent, the corresponding list item will be automatically removed from the schema. And this will make sure the BreadCrumbs work on every page.

Moreover, these variable are user defined meaning that i will be creating them using Google Tag Manager. But before that we have to identify the CSS selectors using SelectorGadget tool.

Get the CSS Selectors for the Target Elements

After having installed the SelectorGadget extension on you Chrome browser, go to the desired page and launch it. A box will open in the bottom right of the website. We want to select the first element on the BreadcrumbList to make it dynamic. Once its done, we do the same process for the second and the third element.

CSS Selector Tool

  • Click on a page element that you would like your selector to match (it will turn green). SelectorGadget will then generate a minimal CSS selector for that element in the bottom of the screen, and will highlight (yellow) everything that is matched by the selector. In this case the gadget will highlight all three elements.
  • Now to select one element only, click on the other highlighted element to remove it from the selector (red), or click on an unhighlighted element to add it to the selector. Through this process of selection and rejection, SelectorGadget helps you come up with the perfect CSS selector for your needs. In this case the goal is to highlight only one element.
  • Once you highlight one element, you can copy the selected css code from the bottom of the page.
  • Repeat the same process for the second and third element.

For more info There is a tutorial video and a bookmarklet version available at Now that we have the css code of the elements selected, let’s go and create the variables in GTM.

Create the Variables in GTM

Now let’s create the variables that will insert information into our schema code using Google Tag Manager. For the BreadCrumbList, we aim to create a couple of variables including bread crumb item name and url.

To create the name variable

  • Open Google Tag Manager and access the left menu.
  • Click on "Variables" to access the variable management section.
  • Scroll down to user defined variable and click ‘New’ User Defined Variables
  • Click on the variable configuration and select “DOM Element” GTM DOM Elements
  • In the DOM Element select CSS Selector from the "Selection Method” menu
  • Name this variable “first_bread_crumb” and click save. GTM DOM Selector
  • Repeat the same steps for the second and third names.

To create the item variable

  • In the user defined variable click ‘New’.
  • Click on the variable configuration and select URL. GTM URL Selector
  • Click on “More Settings”
  • In the “URL Source” menu select “first_bread_crumb”
  • Name this variable “first_bread_crumb_url” and click save. GTM URL Variable
  • Repeat the same steps for the second and third URLs. Now that the variables are created, we have to deploy the code.

Deploy Your JSON-LD Code Using Google Tag Manager

Google Tag Manager (GTM) can be a great tool for implementing dynamic schema markups, especially for non-technical users who may not be comfortable directly editing the website's code.

Deploying a schema code using Google Tag Manager is a straightforward process. Here's a step-by-step guide on how to deploy schema markup using GTM:

  • Log Into Google Tag Manager
  • Create a New Tag: Once inside the container, click on "Tags" in the left-hand sidebar, then click "New" to create a new tag. Create a New Tag
  • Configure Your Tag: Click on "Tag Configuration" and choose "Custom HTML" as your tag type. In the HTML text box, paste your JSON-LD schema markup code. BreadcrumbList Dynamic Tag
  • Set Up a Trigger: Now you got to define when this tag should fire.
  • Click on "Triggering" below the tag configuration. GTM Trigger You can choose a pre-existing trigger or create a new one based on your needs. For example, if you want the schema markup to appear on every page, you could choose the "All Pages" trigger. GTM All Page Trigger
  • Save Your Tag: Click "Save" to finish creating your tag.

Before pushing it live, use the "Preview" mode in GTM to test your tag and ensure it fires correctly on your website.

Test Your Implementation (Preview/Debug Mode)

Testing a tag before deploying it in Google Tag Manager (GTM) is a crucial step to ensure its correct functionality and prevent potential errors or issues.

  • Click “Preview” in the upper right corner. GTM Preview
  • Enter the a URL you’d like to test and click “Connect.” GTM Connect
  • Confirm that Tag Assistant has connected. GTM Connected
  • Select the “Window Loaded” or “Container Loaded” from the left menu. GTM Window Loaded
  • Click on the “Variables” tab (with “Window Loaded” selected) to confirm your variables are working as intended. GTM Variables
  • If you can’t see the values of the variables you created, make sure the CSS selector is correct by following the previous steps GTM Variables Loaded
  • Go back to the page opened via GTM and click finished. GTM Finish Now that everything is working as expected let’s go live and submit the changes

Submit Your Changes

Once you've verified everything works as expected, click "Submit" to publish your changes. This will push your schema markup live on your website. GTM Submit


Wrapping up, keep in mind that this technique can be used for almost any page type, note that some websites have very complex and unorganized CSS selectors and this method might not always work. Therefore I'm building this course that teaches advanced schema creation and automation techniques and can work with any website. With these techniques, not only can you add dynamic schema to your current pages, but you will also handle building and inserting schema code for any website on scale. If you are interested, learn more about this structured data course here.


Pingbacks are open.


Trackback URL


No comments yet.

Login to comment