Article Schema is a computer language format that tells information consumers to expect your content to be organized as an article.
Jekyll CMS can include code you give it into the head of any website. You will learn how to create JSON+LD article schema for the feature snippet value and the semantics.
Prerequisits
- Jekyll Ruby Gem Install documentation
- Any UTF-8 capable text editor
- Install the GEM: jekyll-last-modified-at
- Create
_plugins/_capitalize_all.rb:
require 'liquid'
require 'uri'
# Capitalize all words of the input
module Jekyll
module CapitalizeAll
def capitalize_all(words)
return words.split(' ').map(&:capitalize).join(' ')
end
end
end
# End Module
Liquid::Template.register_filter(Jekyll::CapitalizeAll){{ "Some text" | capitalize_all }}Edit _layouts head tag
Open your _layouts or _includes directory that contains your head tag attributes. Create a script case/when conditional that contains your JSON-LD.
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="robots" content="index,follow">
<meta name="msapplication-tap-highlight" content="no">
<title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
<meta name="description" content="{{page.excerpt}}"/>
{% include favicon.html %}
{% capture critical %}
{% include critical.scss %}
{% endcapture %}
<style>{{ critical | scssify }}</style>
<link
rel="stylesheet"
href="{{ '/assets/css/main.css' | relative_url }}"
media="nope!"
onload="this.media='all'"
/>
<link rel="canonical" href="{{ site.url }}{{ page.url | replace:'index.html',''}}" />
<link rel="preconnect" href="https://syndication.twitter.com" />
{% assign author = site.data.members[page.author] %}
<meta name="author" content="{{ site.title }}" />
<link rel="author" href="/humans.txt" />
<!-- indieweb begin -->
<link rel="alternate" type="application/atom+xml" class="h-feed" title="RSS Feed for DenverProphit.us" href="/feed.xml" />
{% assign items = site.socialmedia.facebook %}
{% assign items1 = site.socialmedia.twitter %}
{% assign items2 = site.socialmedia.github %}
<link href="https://facebook.com/{{items.name}}" rel="me">
<meta property="fb:pages" content="{{items.page_id}}">
<meta property="fb:app_id" content={{items.fbappid }}>
<link href="https://twitter.com/{{items1.name}}" rel="me">
<link href="https://github.com/{{items2.name}}" rel="me">
<link rel="authorization_endpoint" href="https://indieauth.com/auth">
<link rel="token_endpoint" href="https://tokens.indieauth.com/token">
<link rel="webmention" href="https://webmention.io/denverprophit.us/webmention" />
<link rel="pingback" href="https://webmention.io/denverprophit.us/xmlrpc" />
<link rel="micropub" href="/micropub/index.php">
<!-- indieweb end -->
<!-- Website specific OG data -->
{% include ogp.html %}
{% include gtag.html %}
{% include fb-pixel.html %}
<script type="application/ld+json">
{% case page.jsontype %}
{% when 'howto' %}
{% include howtoJSONLD.html %}
{% when 'page' %}
{% include pageJSONLD.html %}
{% when 'post' %}
{% include articleJSONLD.html %}
{% when 'review-post' %}
{% include review-postJSON.html %}
{% when 'about' %}
{% include aboutJSONLD.html %}
{% when 'contact' %}
{% include contactJSONLD.html %}
{% when 'collection' %}
{% include collectionJSONLD.html %}
{% when 'faq' %}
{% include faqJSONLD.html %}
{% when 'product' %}
{% include prodJSONLD.html %}
{% when 'tcollection' %}
{% include tcollectionJSONLD.html %}
{% else %}
{% include homeJSONLD.html %}
{% endcase %}
</script>
<script async src="/assets/js/serviceWorker.js"></script>This will allow you to create additional page types beyond article. I’ll be adding more in future post.
Replace or Add New Article JSON-LD Code
Replace or ADD the following code just before the final } line.
{
"@context": "https://schema.org",
"@type": "Article",
"@id": "#article",
"url": "{{ site.url }}{{ page.url }}",
"name": "{{ page.title }}",
"headline": "{{ page.title }}",
"genre": "{{ page.genre }}",
"keywords": {{ page.tags | replace: "-", " " | join: ", | capitalize_all | jsonify }},
"description": "{{ page.excerpt | strip_newlines | strip | strip_html }}",
"articleSection": "{{ page.categories | join: ' '| replace: "-", " " | capitalize_all }}",
"wordCount": "{{ page.content | number_of_words }}",
"datePublished": "{{ page.date | date_to_xmlschema }}",
"dateModified": "{{ page.last_modified_at | default: page.date }}",
"isBasedOn": {{ page.isbasedon | jsonify }},
"audience": {
"@type": "[BusinessAudience, Occupation]",
"name": "{{ page.business_occupation.name }}",
"audienceType": "{{ page.business_occupation.name }}",
"occupationalCategory": {
"@type": "CategoryCode",
"inCodeSet": {
"@type": "CategoryCodeSet",
"name": "O*Net-SOC",
"dateModified": "{{ page.business_occupation.date }}",
"url": "https://www.onetonline.org/"
},
"codeValue": "{{ page.business_occupation.code }}",
"name": "{{ page.business_occupation.name }},
"url": "https://www.onetonline.org/link/summary/{{ page.business_occupation.code }}"
}
},
"license": "http://creativecommons.org/licenses/by-sa/4.0/",
{% assign author = site.data.members[page.author] %}"author": {
"@type": "Person",
"@id": "{{ site.url }}/about.html#person",
"name": "{{ author.name }}",
"url": "{{ site.url }}/about.html#person"
},
"image": {
"@type": "ImageObject",
"representativeOfPage": "true",
"width": {
"@type": "QuantitativeValue",
"value": "1200",
"unitCode": "E37"
},
"height": {
"@type": "QuantitativeValue",
"value": "800",
"unitCode": "E37"
},
"caption": "{{ page.title }}",
"contentUrl": "{{ site.url }}/assets/images/main/{{ page.featured_image }}",
"url": "{{ site.url }}/assets/images/main/{{ page.featured_image }}",
"license": "http://creativecommons.org/licenses/by-nc-nd/4.0/",
"acquireLicensePage": "{{ site.url }}/terms.html"
},
{% include publisher.html %}
{% include mainentity.html %}
}The breadcrumb artifact on line 61 is the last part of a complete Jekyll Article Schema You can read more about that at Jekyll Breadcrumbs
I’ll detail every front-matter field in GATHER FACTS FOR JEKYLL ARTICLE SCHEMAs
Create Author Data File in YAML Format
Create _data/members.yml
Create the file like the example in your _data folder.
YAML is the format you must use to store author information. Below, is what I use, in preparation for a Person Knowledge Graph. Great video tutorial at Yaml Tutorial | Learn YAML in 18 mins
member1:
birth_country: "United States of America"
birth_city: "Somewhere"
birth_region: CA
birth_zip: 11111
birth_date: "YYYY-MM-DD"
education: "New Horizons Technology School"
image: "example.png"
nationality: "United States of America"
name: "John Doe"
first_name: "John"
last_name: "Doe"
suffix: III.
email: info@somewhere.us
home_country: "United States of America"
home_city: "Anytown"
home_region: "FL"
home_zip: "32134"
gender: Male
permalink: "/about.html"
founder: true
about: "A sentence Here"
kg: "KG Link if you have one"
org:
- name: "Org Name"
url: https://somewhere.comCreate Article Schema Post Template in _drafts
When I was new, I kept forgetting all the necessary front-matter attributes I needed to properly render the page’s metadata. Storing the template helped me stay consistant!
---
layout: xxxxxxx
title: ""
crumbtitle: ""
categories: xxxx-xxxx
tags: xxx xxx
wikidata: ###
genre: "https://en.wikipedia.org/wiki/xxxxxxxx"
isbasedon: ["URL, "URL"]
excerpt: ""
featured_image:
image:
business_occupation:
name: "Text Value"
code: "Numeric"
date: YYYY
twitdesc: "xxxxxxx"
tweet_id: numeric
twitter_platform: "Target Platform Name"
twitter_totaltime: "Time to Perform Content ( 1 hour )"
author: member1
mainentity: ItemPage
related: true
breadcrumb: true
---Gather Facts for Jekyll Article Schema
ELI5 stands for explain like I’m 5.
When people use it online, they’re asking others to explain a complex or obscure topic in the simplest of terms. So, if taken literally, they would explain something in a way that a 5-year-old would understand. However, this acronym is rarely used literally. You are telling an AI bot the facts about your Jekyll Article Schema post.
Your Jekyll Article Schema will boil down to the 3 V’s! @DavidAmerland
- Volume
- The number of posts about a given Entity
- Variety
- Be it content types or a differing viewpoint about an Entity
- Veracity
- Accurate facts about a given Entity
Important Facts in your article front-matter
- category is a hyphenated term. It should be the top-most ontology of a thing.
- tags are hyphenated names delimited by a space.
- isbasedon Replace URL with FQDN links. Each link should be enclosed in quote marks. The delimiter is a comma.
- tweet_id Is the numerical value of the tweet. It can only be updated after the first tweet. If you prefer to carry on the discussion about the article on another social platform, change the key/value to that platform such as Github. Change the code on line ## of mainentity.html in the _includes folder.
-
business_occupation You are going to need 3 facts from Onet Online
- Occupation Name
- Occupation Code
- Year Created or Modified
- The mainentity inclusion on line three of step 6 a template variable for many entity types. Here, are but a few of them I use:
- Your page mentions explain various entities mentioned on the page. But, are not necessarily the main topic of your article.
- mentions
- Indicates that the CreativeWork contains a reference to, but is not necessarily about a concept.
wikidatas:
- name: "Jekyll Static Site Builder"
url: "https://www.wikidata.org/wiki/Q17067385"
- name: "JSON-LD Schema"
url: "https://www.wikidata.org/wiki/Q6108942"
- name: "Target Market"
url: "wikidata.org/wiki/Q198981"
- name: "Structured Data"
url: "https://www.wikidata.org/wiki/Q26813700"
"mainEntityofPage": {
"@type": "{{ page.mainentity }}",
{% if page.wikidatas %}
"mentions": [
{% for item in page.wikidatas %}
{
"@type": "Thing",
"name": "{{ item.name }}",
"@id": "{{ item.url }}"
}
{% if forloop.last %}],{% else %},{% endif %} {% endfor %}{% endif %}
"primaryImageOfPage": {
"@type": "ImageObject",
"representativeOfPage": "true",
"width": {
"@type": "QuantitativeValue",
"value": "1600",
"unitCode": "E37"
},
"height": {
"@type": "QuantitativeValue",
"value": "800",
"unitCode": "E37"
},
"caption": "{{ page.title }}",
"url": "{{ site.url }}/assets/images/main/{{ page.featured_image }}",
"contentUrl": "{{ site.url }}/assets/images/main/{{ page.featured_image }}"
},
"lastReviewed": "{{ page.last_modified_at }}",
"reviewedBy": {
"@type": "Person",
"@id": "{{ site.url }}/about.html#person",
"name": "{{ author.name }}",
"url": "{{ site.url }}/about.html"
},
"accountablePerson": {
"@type": "Person",
"name": "{{ author.name }}",
"@id": "{{ site.url }}/about.html#person",
"url": "{{ site.url }}/about.html"
},
"specialty": {
"@type": "Specialty ",
"@id": "https://www.wikidata.org/wiki/{{ page.wikidata }}"
},
"copyrightHolder": {
"@type": "ProfessionalService",
"@id": "{{ site.url }}/about.html#publisher",
"name": "{{ site.title }}",
"telephone": "{{ site.tel }}",
"address": {
"@type": "PostalAddress",
"addressLocality": "{{ site.city ",
"addressRegion": "{{ site.state }}",
"postalCode": "{{ site.zip }}"
},
"logo": {
"@type": "ImageObject",
"representativeOfPage": "false",
"width": {
"@type": "QuantitativeValue",
"value": "500",
"unitCode": "E37"
},
"height": {
"@type": "QuantitativeValue",
"value": "500",
"unitCode": "E37"
}
},
"caption": "{{site.logo.caption}}",
"url": "{{site.url}}/assets/images/main/{{ site.logo }}"
},
"copyrightNotice": "{{ site.copynotice }}",
"copyrightYear": "{{ page.date | date: '%Y' }}",
"discussionUrl": "https://twitter.com/status/{{ page.tweet_id }}"
{% capture breadcrumb %}{{ page.breadcrumb }}{% endcapture %}{% if breadcrumb == "true" %},{%include breadcrumb.html %}{% endif %}
}I describe mainEntityofPage as the jekyll Article Schema Colophone.
- Colophone
- A publisher's emblem or imprint, especially one on the title page or spine of a book. - Historically, a statement at the end of a book, typically with a printer's emblem, giving information about its authorship and printing.
Any Organization Type can be used. I used ProfessionalService. The relatedLink runs though the other pages in that SAME category and creates a JSON list of links for spiders to traverse. Also, specialty in this instance, is the page’s specialty for specific expertise, usually after significant study, time, and effort. If you think I’ve not explained something good enough, tweet-reply from the share this article. It will create a reply to my original tweet.
