How to Implement Schema Markup with Google Tag Manager | How to Add Schema Code

 The importance of schema.org has significantly grown in the SEO world since its introduction in 2011. Schema.org is a collection of schemas for structured data markup (sometimes called “schema markup”) that helps search engines better understand content on websites. Implementing this markup on a site can also improve how that site’s listings appear in SERPs.

Google Tag Manager has many uses, but one of my favorite things to do is add schema code using GTM. Honestly this is probably my favorite Google product to date, and unleashing its power to help you crush the SERPs is what I am here to show you. Google loves structured data, and personally I do not see that changing any time soon. Using the GTM tag system, we are able to add markup for just about anything by creating tags. As someone who does this at an agency, Tag Manager has made markup considerably easy and I hope this can apply to others.

What is Google Tag Manager?

If you have not heard of Google Tag Manager, you can read all about it at: https://www.google.com/analytics/tag-manager/. I suggest you learn as much as you can about it, as it really is a powerful tool when used right.

In "simple" terms, GTM is a tag management system that allows you to create and deploy different tags (Analytics, Remarketing, Transactions) through a container placed on your website. You then can set "tag-firing triggers" that define what pages of your site the tags are deployed in. One of the biggest advantages of GTM is adjusting event tracking without touching the code, as you will see below, it makes changing schema easy without the risk of breaking the website. It has a very eye pleasing user interface so even non-developers can create tags without touching code.

By properly implementing structured data markup from schema.org, you can gain a competitive advantage, increase click-through rate, drive additional traffic and cost-effectively improve organic search results.

What Schema Can I Use With GTM?

Schema.org is the structured data vocabulary that we will be using in this GTM demo. I love Schema, it is so powerful, yet so many websites either have poor implementation or are not using it at all. You can literally markup just about anything, and the benefits from doing this can really pay off in the search results. Visit Schema.org to learn more.

JSON-LD is the format of my choice and the following examples will be using them.

One way to implement schema markup is by directly tagging the HTML code on your web pages. However, this requires two things:

1. Some basic coding knowledge
2. CMS (Content Management System) access and/or FTP (File Transfer Protocol) access

The challenge is that often, SEOs don’t have the required coding skills, and many companies have strict policies on who can access their site’s website files.

Please note: The steps below assume you already have Google Tag Manager set up.

Step 1

Create A New Tag. by clicking the "Add New Tag" link from the main interface.

Step 2

Name Your Tag - Keep It Simple, and Make It Easy To Remember.

Step 3

Create a new custom HTML tag in Google Tag Manager and name it something descriptive, like: “Organization Schema Markup.”

Step 4

Add Your Schema To The Tag - Can be found in JSON-LD format at http://schema.org/LocalBusiness. You can also use the Schema Creator

Sample Code:<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "LocalBusiness",
  "address": {
    "@type": "PostalAddress",
    "addressLocality": "Mexico Beach",
    "addressRegion": "FL",
    "streetAddress": "3102 Highway 98"
  },
  "description": "A superb collection of fine gifts and clothing to accent your stay in Mexico Beach",
  "name": "Beachwalk Beachwear & Giftware",
  "telephone": "850-648-4200"
}
</script>

Step 5

Set Your Tag Firing Triggers - This tells us what pages the tag will fire on. - Choose The "Some Pages" Option

For this tag we will be setting it up to fire on the contact page. If you would like to set it to fire on every page, just click the "All Pages" option. For this tutorial we will be going one step further. Select the "Some Pages" option as pictured below.

This is going to bring up a new popup called "Choose Pages". This allows us to choose the pages we want it to fire on. It uses variables and operations that can be used for firing rules. If you are familiar with Regular Expressions, you may also use those as well. We will be making this tag ONLY fire on the homepage. So name your triggers accordingly as they are reusable!

Click the red "New Button"

A new row will appear with Name, Variable, Operation, and Value. This is where we tell our tag where to fire. For this tag we will be using an exact URL match for the firing conditions. In human terms we are telling Google Tag Manager we only want the tag fired on the contact page. Click save after you have the settings entered.

Here are the settings:

Name: Contact Page

Variable: Page URL

Operation: Equals

Value: http://www.yourdomain.com/contact (Or whatever your page url is - https://sourabhnagori.blogspot.com/)

You should then see the "Contact Page" trigger at the bottom of the page. It should look like the image below. Click the "Create Tag" button after you have confirmed all looks good.

Step 6

Testing Your New Tag, Validation, and Publishing Your GTM Container

One amazing feature of Google Tag Manager allows you to debug your tags in your browser using "Preview Mode". This allows us to test tags before deploying any code on the site.. GTM is able to do this because they work in versions. You work on a version, but your changes are not live until you publish the newest version. This is great because it allows us to created different versions of GTM containers to use in say a seasonal manner. It also helps with learning as you can preview any version. In the top nav you can see the version you are editing and the unpublished changes compared to the live version.

Ok, so now we have our tag and we want to check that it is working properly before we publish the tag. There is a dropdown arrow to the side of the "Publish Button", we want to expand the dropdown and choose "Preview And Debug".

You should now see an orange banner that says "Now Previewing Version X". You will also see there are a few options in that header banner. When you want to update the preview, you will need to click refresh from this banner. Also when you are done using the preview mode, make sure to click " Leave Preview Mode" unless you want to see the GTM preview every time you are on your website. I have not used the "Share Preview" feature, so I can not speak on how to use it!

The next step is to browse to your contact page to begin the testing. Depending on if you are using GTM to implement your Google Analytics tracking, (you should) you might only see the tag we build firing. As you can see in my example below, I am using GTM for universal analytics, Local Business Schema, and my Org Schema test I am doing for the knowledge graph. This interface actually is pretty cool. There is a navigation box to the left that include: Summary, Page Load, DOM Ready, Pageview.

Make sure the "Summary Tab" is the current view. You should see "Tags Fired On This Page:" as well as "Tags Not Fired On This Page". You should see the Local Business Schema tag as fired on your contact page.

If you can see the tag firing and working as intended, it is time for validation. If the tag is not showing as "Fired" you will need to retrace your steps for errors.

Which brings us to validation. This is a step you MUST do to ensure Google and other search engines see your structured data with no errors.

Browse to Google's structured data testing tool at - https://developers.google.com/structured-data/testing-tool/. You can copy and paste your source code if you would like, but I prefer to just let Google fetch the URL so I know what they are actually seeing.

On the next screen you should see the source code for the URL that you had the tool fetch, as well as the results of the structured data located on the page. On the right side of the page you should see the status of the structured data on the page. If it looks like the below image, you are good to go!

Now that we are all validated, it is time to publish the GTM container to our live website. Navigate back to Google Tag Manager, and into your account with the container. From there click the "Publish" button located in the upper right hand corner. This will bring a prompt up like the one in the image below. Click publish now, and start adding more structured data with Google Tag Manager!