Highlighter Deployment Options

Modified on Fri, 3 Mar, 2023 at 10:55 AM

There are currently 4 different deployment options for schema markup created using the Highlighter:


  1. JavaScript

  2. JavaScript with Cache

  3. Crawler

  4. 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

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article