Blog guide

August 24, 2022

Implementing Rich Results in a Content Management System (CMS): A Guide for Bartholomew CMS Users

Tim McCallum

spin cms wasm webassembly cloud rust seo microservices bartholomew rich results

Implementing rich results in a content management system will make your listings stand out from other listings for a given search engine’s results page (SERP). Not to be confused with rich media, rich results don’t just refer to organizing non-text content such as videos & images. Other text-based contents such as events, job listings and even COVID-19 announcements all qualify to use rich results (a structured data markup approach to content). Whilst rich results can make your content more visually appealing, implementing rich results can also help search engines to crawl and rank your content which may result in higher rankings.

Bartholomew CMS

As you may already know, this blog post is brought to you by our own lightweight WebAssembly (Wasm) Content Management System (CMS) called Bartholomew. Bartholomew is not a static site generator; it is powered by a lightweight WebAssembly module that processes page requests individually on demand. Bartholomew uses Handlebars templating, which makes creating content as easy as just writing a few lines of markdown.

Structured Data

Rich results are created using structured data inside your content. For this example, we use JSON-LD, a JSON-based serialization for linked data. The reason is that Google prefers JSON-LD for web content.

Whilst most search-related structured data uses the schema.org vocabulary, you can also refer to the Google Search Central documentation as a definitive guide, especially where Google Search behaviour is concerned. The Schema.org site has a lot of attributes and objects which are valid for other platforms and services. However, some of these attributes and objects aren’t necessarily required by Google Search.

Creating Rich Results

Video

Let’s go ahead and create a JSON-LD code snippet for a video. In this case, we go straight to Google Search Console Documentation, specifically the JSON-LD Video Object section and read about the properties i.e. name, description, contentUrl and so forth.

Please note: That there are other online JSON-LD resources, including this JSON-LD Playground, which lets you choose from pre-made JSON-LD examples to get started. Another great resource is the jsonld.com site which is intended for webmasters seeking pre-made and validated JSON-LD markup. Also, Google has a structured data code lab that walks you through adding several structured data examples to a page (which takes approximately 1/2 hour to complete).

Here is an example of a rich result code snippet for video. Note: The contents inside the script element are valid JSON, so feel free to use a JSON validator such as (JSONLint) as an additional tool when creating your own custom rich result markup.

<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "VideoObject",
    "name": "My video",
    "description": "My video's description",
    "uploadDate": "2022-08-18T08:00:00+08:00",
    "contentUrl": "https://my-video-server/video/123/file.mp4"
}
</script>

Fermyon Website Example

As you may be aware, we at Fermyon Technologies will be attending the Open Source Summit Europe 2022; held in Dublin, Ireland. We recently wrote a blog post about this upcoming event and embedded a short video into that blog post as well.

The following is an example of the JSON-LD that we then used (in that particular blog post). Note: Whilst you can see URLs to the actual video content, this rich results data is just metadata. In addition to this data, the actual video embedding takes place elsewhere in the page’s content.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "VideoObject",
  "name": "Fermyon Technologies, Inc. are attending Open Source Summit Europe 2022 Dublin Ireland.",
  "description": "Fermyon Technologies, Inc. are thrilled to be joining the Open Source Summit Europe 2022 in Dublin Ireland; from September 13th to 16th.",
  "thumbnailUrl": "https://www.fermyon.com/static/image/icon/mstile-150x150.png",
  "uploadDate": "2022-08-13T08:00:00+08:00",
  "duration": "PT0M24S",
  "contentUrl": "https://youtu.be/UUzscJY6j2A",
  "embedUrl": "https://www.youtube.com/embed/UUzscJY6j2A"
}
</script>

All of the web pages and blog posts in Bartholomew are Markdown files. Markdown’s simple format makes creating and editing content easy and fast, which is great for content creators.

If you like the idea of a frictionless production-ready CMS which can help grow a business or a brand whilst reducing costs, please reach out. For example, if you are trying to set up your own Bartholomew CMS and have any questions, please jump into our Discord space.

Whilst the majority, if not all, of the content can be Markdown, Bartholomew also allows the embedding of HTML tags. This flexibility allows the person creating/editing their content to paste the rich results code block straight into the Markdown file.

Testing Rich Results

When you are finished adding the rich media, you can go ahead and make sure that the content passes the rich results test. This is a free online tool, which allows you to test both public URLs to content and also pasted-in HTML source code.

Here is an example of how the code block from above is rendering in the site’s HTML and therefore passing the rich results test.

The test only takes a couple of seconds, and as you can see we have successfully added rich result video data to our blog post.

Monitoring Rich Results

Once deployed, be sure to check your rich result status reports. The status reports essentially monitor the health of your existing pages, on an ongoing basis. A great way to quickly check that everything is still working as time goes by.

And that’s it! The process of adding rich results only took minutes. If you need help optimizing your Bartholomew CMS content, as described in this blog, please reach out at any of the following contact points.

Thank you for taking the time to read this blog.

Fermyon Contact Details

Discord: We have a great Discord presence. Please join us in Discord and ask questions and share your experiences with Fermyon products like Spin.

Twitter: Following and subscribing to our Twitter is a great way to keep in touch.

GitHub: We can be reached via GitHub.

Email: Please feel free to Email us.

Become an Insider

If you would like to “Become an Insider”, please fill out this brief form to get early access, deeper insights and other insider invitations.

We are Hiring

We have a number of job openings available in areas of training, software engineering, developer relations, community management and more.