There are currently 4 different deployment options for schema markup created using the Highlighter:
JavaScript
JavaScript with Cache
Crawler
JavaScript + WebHooks
Javascript (Most Common)
The Javascript option is a client-side deployment option that requires the placement of the following tag on every templated page of your website.
<script>window.schema_highlighter={accountId: "Cupcake", outputCache: true}</script>
<script async src="https://cdn.schemaapp.com/javascript/highlight.js"></script>
This tag is what will fetch and build the associated schema markup for each page. This is typically added via a Tag Manager or in your CMS's theme.
The schema markup is dynamically generated every time a visitor comes to that particular page and therefore the schema markup is always up to date. This is the most common deployment method and requires hardly any technical resources.
How it works:
The highlight.js is used to look up the page's configuration file using the URL of the page. It will inspect the HTML of the page determined by the Configuration file to find content, and then places the content into a JSON structure to represent Schema Class / Properties. Once called, it returns a combined JSON-LD data block into a script tag.
Pros:
Immediate updates to schema markup
Durable integration method (most commonly used)
Cons:
AMP third-party JavaScript not supported
Javascript with Cache
The JavaScript with Cache option is a client side option that uses the highlighter javascript (seen above) to generate the markup and store it on the Schema App CDN while also using the schemaFunctions javascript to the generated markup from the CDN. The motivation behind this option is for sites that very dynamic and/or are less optimized which doesn't allow google to pickup complete content while crawling your site. This option would also be chosen instead of the JavaScript + Webhooks when a server side integration is not possible.
Place the following code on every templated page of your site:
<script>window.schema_highlighter={accountId: "CupCake", output: false, outputCache: true, fetchFromHighlightJsCache: true}</script>
<script async src="https://cdn.schemaapp.com/javascript/highlight.js"></script>
How it works:
The highlight.js is used to look up the page's configuration file using the URL of the page. It will inspect the HTML of the page determined by the Configuration file to find content, and then places the content into a JSON structure to represent Schema Class / Properties. The generated markup is sent to the Schema App CDN. Once the markup is on the CDN, schemaFunctions will pull that generated markup from the CDN and bring it into to your page. The implication is that markup can take up to 60 minutes to update when content changes, and, on the first page load no markup exists on the CDN so no markup will be included on the page.
Pros:
Quick loading Schema Markup for slower page speeds.
Nearly up to date Schema Markup (allows multiple updates per day).
No requirement for Webhooks as content is loaded from Schema App's CDN.
Cons:
AMP third-party JavaScript not supported
Updates less frequently than the JavaScript Rendering option.
Crawler
This method is typically used for templates which have a low content update frequency. That is because the Schema Markup is only crawled and generated on a weekly cadence (or on any create/edit events).
Place the following code on every templated page of your site:
(This is not compulsory as the crawler deployment could work without Javascript)
<script>window.schema_highlighter={accountId: "Cupcake", outputCache: true}</script>
<script async src="https://cdn.schemaapp.com/javascript/highlight.js"></script>
How it works:
Schema App's crawler (schema bot) will crawl the site page by page until it finds a page that matches the template's page set. Once found it will check whether its json-ld exists or matches a current version stored and if needed send out an update.
Note some sites that block crawlers may need to whitelist our bot, its useragent is
Mozilla/5.0 (compatible; SchemaBot/1.2; +https://www.schemaapp.com/bot/)
It will crawl from the following IP address: 52.45.62.191
Pros:
Fastest HTML rendering
Schema App pre-generates data with a crawler
Supports AMP
Supported by Schema App CMS integrations
Cons:
Requires backend integration (unless using Schema App CMS integration)
Less frequently updated schema markup
JavaScipt + Webhooks
With a hybrid approach, JavaScript generates the data and the data is sent to your server-side integration (e.g. Schema App Plugins) through a Webhook. Useful for sites with that change often and slower load times. The schema markup is generated on every page load much like the embedded Javascript but is sent to the backend. That means that the schema data is only as recent as the last visit. In addition Schema App will only send webhooks if the content is different from that last reported content. This means clients only receive updates on content changes.
You must first add an endpoint that supports Schema App's webhooks. (If using WordPress this will be done for you). Next, Make sure the following tag is included on every templated page.
<script>window.schema_highlighter={accountId: "CupCake", output: false}</script>
<script async src="https://cdn.schemaapp.com/javascript/highlight.js"></script>
Pros:
- Nearly up to date schema markup (Realtime - 1 page load)
- Supported by Schema App CMS integrations
- Supports AMP
Cons:
- Requires Schema App CMS integration, e.g. Wordpress, Drupal, or custom backend webhook handler.
- Can be out of date with live content (only as recent as the last page load)
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article