Schema

Hooray Schema Markup Framework

A CDN to deploy a dynamic schema markup framework for Hooray Agency’s advanced SEO hospitality clients.

Context

Schema markup (aka structured data) is often difficult to manage at scale. As a site’s (or sites’) content base grow & change, so should (ideally) the schema markup code. This is a challenge for many SEOs, as the schema markup is often hard-coded into the site’s HTML, and often page-by-page.

To address this, we’ve built a CDN that delivers a structured data framework to a website via a single script tag. This script tag queries a central repository, deploying a structured data framework to each page differently based on the page’s content.

Features

Centralized Client Information
Pre-Mapped Schema Markup Framework
Conditional Generation
Unique Object Identifier Framework
Fallback Value Utilization

{
  "name": "Timbers Kaua‘i",
  "type": "Resort",
  "sitemap": "https://www.timberskauai.com/sitemap_index.xml",
  "slogan": "Living the Spirit of Aloha",
  "petsAllowedTrueFalse": false,
  "totalRoomCount": 47,
  "priceRange": "$$$",
  "checkInTime": "16:00",
  "checkOutTime": "09:00",
  "availableLanguage": ["English", "Spanish"]
}

function QuantitativeValue(room) {
    
    const roomCount = room?.numberOfRooms || room?.roomCount || null;
    if (!roomCount) return {};
    
    return {
        '@type': 'QuantitativeValue', // https://schema.org/QuantitativeValue
        '@id': id('QuantitativeValue', room.name + '-' + roomCount),
        'url': room.url || hotel.homepage, // the hotel object is accessible via inherited scope
        'unitText': room.name,
        'value': roomCount,
        'partOf': Product(room),
    }
}

function Product(room) {}

Benefits

Easier/faster initial deployment via a global script tag.
External control of both input objects and the generative framework.
Faster page loading speed as the schema is loaded after webpage content.

Implementation

Talk to Jake Labate at Hooray to confirm the hotel brand’s data is assembled property and in the repository.
Add the following script tag to the head of the website (globally). Ensure the type is set to module.

<!-- Hooray Schema Markup Framework -->
<script type="module" src="https://schema.hooray-seo.com/script.js?domain="></script>

Add your unique domain code as the domain URL param value the end of the script src to query the correct data.
Publish the site. Wait / refresh pages as needed. WordPress can take up to an hour to propagate header.php files.
Validate the structured data with the Google’s Rich Result Test. This validator checks for client side rendered-schema.

Notes

Don’t rely on exclusive use the Schema.org Validator. It doesn’t detect client-rendered schema.
Google confirms client/dynamically added schema markup is ok.

To Do

We are experimenting with delivering a smaller and object-selected schema to each page, allowing for a more granular (and therefore potentially more content-indicative accurate) page annotation.
We are building a UI to manage brand data to allow direct brand data creation, editing and to deploy schema directly from the UI.
We are implementing a page-specific server cache to reduce the number of requests, and to speed up the delivery of the schema.

Credit (or blame)

Framework & delivery method by Jake Labate, Head of SEO at Hooray Agency.