Skip to content

Commit

Permalink
feat(ssg): added itemprop headline and subheadline
Browse files Browse the repository at this point in the history
  • Loading branch information
sebastienrousseau committed Sep 26, 2023
1 parent 171a4f0 commit c00d90d
Show file tree
Hide file tree
Showing 4 changed files with 178 additions and 69 deletions.
126 changes: 126 additions & 0 deletions content/post.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,126 @@
---

# Front Matter (YAML)

author: "Jane Doe" ## The author of the page. (max 64 characters)
banner_alt: "Green And Black Tiled Wall" ## The banner alt of the site.
banner_height: "398" ## The banner height of the site.
banner_width: "1440" ## The banner width of the site.
banner: "https://kura.pro/unsplash/images/banners/ryunosuke-kikuno-G5hYMUoJQf8-unsplash.jpg" ## The banner of the site.
cdn: "https://kura.pro" ## The CDN of the site.
changefreq: "weekly" ## The changefreq of the site.
charset: "utf-8" ## The charset of the site. (default: utf-8)
cname: "kaishi.one" ## The cname value of the site. (Only required for the index page.)
copyright: "© 2023 Kaishi. All rights reserved." ## The copyright of the site.
date: "July 12, 2023"
description: "Everything You Need to Build a Stunning Website." ## The description of the site. (max 160 characters)
download: "" ## The download url for the product.
format-detection: "telephone=no" ## The format detection of the site.
hreflang: "en" ## The hreflang of the site. (default: en-gb)
icon: "https://kura.pro/kaishi/images/logos/kaishi.svg" ## The icon of the site in SVG format.
id: "https://kaishi.one" ## The id of the site.
image_alt: "Logo of Kaishi, a starter template for static sites" ## The image alt of the site.
image_height: "630" ## The image height of the site.
image_width: "1200" ## The image width of the site.
image: "https://kura.pro/kaishi/images/banners/banner-kaishi.webp" ## The main image of the site in SVG format.
keywords: "kaishi starter templates, shokunin static site generator, static site generator, starter templates, bootstrap, bootstrap css, bootstrap javascript, content security policy, open graph meta tags, responsive navigation bar, schema.org meta tags" ## The keywords of the site. (max 160 characters)
language: "en-GB" ## The language of the site. (default: en-GB)
layout: "post" ## The layout of the site.
locale: "en_GB" ## The locale of the site.
logo_alt: "Logo of Kaishi, a starter template for static sites" ## The logo alt of the site.
logo_height: "33" ## The logo height of the site.
logo_width: "100" ## The logo width of the site.
logo: "https://kura.pro/kaishi/images/banners/banner-kaishi.webp" ## The logo of the site in SVG format.
name: "Kaishi" ## The name of the website. (max 64 characters)
permalink: "https://kaishi.one/features" ## The url of the site.
rating: "general" ## The rating of the site.
referrer: "no-referrer" ## The referrer of the site.
revisit-after: "7 days" ## The revisit after of the site.
robots: "index, follow" ## The robots of the site.
short_name: "kaishi" ## The short name of the site. (max 12 characters)
subtitle: "Build Amazing Websites with Minimal Effort using Kaishi Starter Templates" ## The subtitle of the page. (max 64 characters)
tags: "kaishi starter templates, shokunin static site generator, static site generator, starter templates, bootstrap, bootstrap css, bootstrap javascript, content security policy, open graph meta tags, responsive navigation bar, schema.org meta tags" ## The tags of the site. (max 160 characters)
theme-color: "rgb(143, 250, 111)" ## The theme color of the site.
title: "Features" ## The title of the page. (max 64 characters)
url: "https://kaishi.one" ## The url of the site.
viewport: "width=device-width, initial-scale=1, shrink-to-fit=no" ## The viewport of the site.

# RSS - The RSS feed front matter (YAML).
atom_link: https://kaishi.one/rss.xml
category: "Technology"
docs: https://validator.w3.org/feed/docs/rss2.html
generator: "Shokunin 🦀 (version 0.0.17)"
item_description: RSS feed for the site
item_guid: https://kaishi.one/rss.xml
item_link: https://kaishi.one/rss.xml
item_pub_date: "Thu, 12 Jul 2023 15:15:15 GMT"
item_title: "RSS"
last_build_date: "Thu, 12 Jul 2023 15:15:15 GMT"
managing_editor: [email protected]
pub_date: "Thu, 12 Jul 2023 15:15:15 GMT"
ttl: "60"
type: "website"
webmaster: [email protected]

# Apple - The Apple front matter (YAML).
apple_mobile_web_app_orientations: "portrait" ## The Apple mobile web app orientations of the page.
apple_touch_icon_sizes: "192x192" ## The Apple touch icon sizes of the page.
apple-mobile-web-app-capable: "yes" ## The Apple mobile web app capable of the page.
apple-mobile-web-app-status-bar-inset: "black" ## The Apple mobile web app status bar inset of the page.
apple-mobile-web-app-status-bar-style: "black-translucent" ## The Apple mobile web app status bar style of the page.
apple-mobile-web-app-title: "Kaishi" ## The Apple mobile web app title of the page.
apple-touch-fullscreen: "yes" ## The Apple touch fullscreen of the page.

# MS Application - The MS Application front matter (YAML).

msapplication-navbutton-color: "rgb(143, 250, 111)"

# Twitter Card - The Twitter Card front matter (YAML).

## twitter_card - The Twitter Card type of the page.
twitter_card: "summary"
## twitter_creator - The Twitter Card creator of the page.
twitter_creator: "janedoe"
## twitter_description - The Twitter Card description of the page.
twitter_description: "Everything You Need to Build a Stunning Website."
## twitter_image - The Twitter Card image of the page.
twitter_image: "https://kura.pro/kaishi/images/logos/kaishi.svg"
## twitter_image:alt - The Twitter Card image alt of the page.
twitter_image_alt: "Logo of Kaishi, a starter template for static sites"
## twitter_site - The Twitter Card site of the page.
twitter_site: "janedoe"
## twitter_title - The Twitter Card title of the page.
twitter_title: "Kaishi, a Shokunin Static Site Generator Starter Template"
## twitter_url - The Twitter Card url of the page.
twitter_url: "https://kaishi.one"

# Humans.txt - The Humans.txt front matter (YAML).
author_website: "https://kura.pro" ## The author website of the page.
author_twitter: "@wwdseb" ## The author twitter of the page.
author_location: "London, UK" ## The author location of the page.
thanks: "Thanks for reading!" ## The thanks of the page.
site_last_updated: "2023-07-05" ## The last updated of the site.
site_standards: "HTML5, CSS3, RSS, Atom, JSON, XML, YAML, Markdown, TOML" ## The standards of the site.
site_components: "Kaishi, Kaishi Builder, Kaishi CLI, Kaishi Templates, Kaishi Themes" ## The components of the site.
site_software: "Shokunin, Rust" ## The software of the site.

---

![A very tall building that has a lot of holes in it](https://kura.pro/stock/images/banners/johannes-plenio-6XUA5KQ9-1k.webp).class=\"img-fluid clearfix\"

## Starter Templates

<p>
by
<span itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<span itemprop="name"><a href="{{author}}">{{author}}</a></span>
</span>
</p>
<p><time datetime="{{item_pub_date}}" itemprop="datePublished">{{item_pub_date}}</time></p>

All the starter templates, whether pages or websites are built from scratch
using the same principles and features. This means that you can easily mix and
match them together to create your own custom layouts and content.

Get started with Shokunin using any of our Starter Templates for building
your website or web application.
4 changes: 2 additions & 2 deletions src/modules/html.rs
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ use crate::utilities::directory::{
/// let html = generate_html(content, title, description, None);
/// let html_str = html.unwrap_or_else(|e| panic!("Error: {:?}", e));
///
/// assert_eq!(html_str, "<h1 id=\"h1-my\" tabindex=\"0\" id=\"\" tabindex=\"0\" class=\"my\">My Page</h1><p>This is a test page</p><h2 id=\"h2-hello\" tabindex=\"0\" class=\"hello\">Hello, world!</h2>\n<p>This is a test.</p>\n");
/// assert_eq!(html_str, "<h1 id=\"h1-my\" id=\"\" tabindex=\"0\" class=\"my\" itemprop=\"headline\">My Page</h1><p>This is a test page</p><h2 id=\"h2-hello\" tabindex=\"0\" class=\"hello\">Hello, world!</h2>\n<p>This is a test.</p>\n");
///
/// ```
//
Expand Down Expand Up @@ -126,7 +126,7 @@ fn generate_header(title: &str, id_regex: &Regex) -> String {
if title.is_empty() {
return String::new();
}
let header_str = format!("<h1 id=\"\" tabindex=\"0\">{}</h1>", title);
let header_str = format!("<h1 id=\"\" tabindex=\"0\" itemprop=\"headline\">{}</h1>", title);
format_header_with_id_class(&header_str, id_regex)
}

Expand Down
12 changes: 9 additions & 3 deletions src/utilities/directory.rs
Original file line number Diff line number Diff line change
Expand Up @@ -278,11 +278,17 @@ pub fn format_header_with_id_class(

if !id_attribute_added && (c == ' ' || c == '>') {
formatted_header_str.push_str(&format!(
" id=\"{}-{}\" tabindex=\"0\"",
" id=\"{}-{}\" tabindex=\"0\" {}",
header_type,
id_regex
.replace_all(&first_word, "-"),
id_regex.replace_all(&first_word, "-"),
if header_type == "h1" {
"itemprop=\"headline\""
} else {
"itemprop=\"subheadline\""
}
));

print!("header_type={:?}", header_type);
id_attribute_added = true;
}

Expand Down
105 changes: 41 additions & 64 deletions template/post.html
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,7 @@
<!-- # End Apple Meta Tags -->

<!-- # Start Content Security Policy Meta Tags -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self';
script-src 'self' 'unsafe-inline' *.google-analytics.com https://cdn.jsdelivr.net unpkg.com www.googletagmanager.com x.clarity.ms;
connect-src 'self' collect;
img-src 'self' data: https: kura.pro;
style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net;
font-src 'self' https://fonts.gstatic.com;
media-src 'self';" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline' *.google-analytics.com https://cdn.jsdelivr.net unpkg.com www.googletagmanager.com x.clarity.ms; connect-src 'self' collect; img-src 'self' data: https: kura.pro; style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net; font-src 'self' https://fonts.gstatic.com; media-src 'self';" />
<!-- # End Content Security Policy Meta Tags -->

<!-- # Start Microsoft Meta Tags -->
Expand All @@ -42,20 +36,15 @@
<!-- # End Twitter Meta Tags -->

<!-- # Start Links -->
<link as="style" crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" onload="this.onload=null;this.rel='stylesheet'" rel="preload" />
<link rel="alternate" href="{{url}}" hreflang="{{hreflang}}" />
<link rel="alternate" type="application/rss+xml" href="/rss.xml" />
<link rel="apple-touch-icon" href="{{cdn}}/{{short_name}}/images/icons/{{apple_touch_icon_sizes}}.png" sizes="{{apple_touch_icon_sizes}}" />
<link rel="canonical" href="{{url}}" />
<link rel="icon" type="image/x-icon" href="{{cdn}}/{{short_name}}/images/favicon.ico" />
<link as="style" crossorigin="anonymous"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
onload="this.onload=null;this.rel='stylesheet'" rel="preload" />

<link rel="apple-touch-icon" href="{{cdn}}/{{short_name}}/images/icons/{{apple_touch_icon_sizes}}.png"
sizes="{{apple_touch_icon_sizes}}" />
<link rel="icon" type="image/png" href="{{cdn}}/{{short_name}}/images/icons/16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="{{cdn}}/{{short_name}}/images/icons/32x32.png" sizes="32x32" />
<link rel="icon" type="image/x-icon" href="{{cdn}}/{{short_name}}/images/favicon.ico" />
<link rel="manifest" href="/manifest.json" />
<link rel="alternate" type="application/rss+xml" href="/rss.xml" />
<!-- # End Links -->

<!-- # Start Styles -->
Expand Down Expand Up @@ -155,21 +144,20 @@
<!-- Header-->
<header>
<div class="w-100 p-5" style="
background-image: url({{banner}});
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
height: {{banner_height}};
width: {{banner_width}};
" role="img" title="{{banner_alt}}" aria-label="{{banner_alt}}">
background-image: url({{banner}});
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
height: {{banner_height}};
width: {{banner_width}}";
role="img" title="{{banner_alt}}" aria-label="{{banner_alt}}">
<div class="w-100 h-100 p-5 d-flex align-items-center">
<div class="text-center text-white center mx-auto rounded rounded-3 p-5" style="
background-color: rgba(0, 0, 0, 0.618);
width: 61.8vw;
height: auto;
">
<p class="display-3 fw-bold">{{name}}</p>
<p class="display-6 fw-normal">{{subtitle}}</p>
height: auto;">
<p class="display-3 fw-bold">{{name}}</p>
<p class="display-6 fw-normal">{{subtitle}}</p>
</div>
</div>
</div>
Expand All @@ -178,14 +166,8 @@
<!-- Main content-->
<main id="main" class="bd-masthead fs-5 p-5" aria-label="main">
<div class="container text-start justify-content-between">
<p>
by
<span itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<span itemprop="name"><a href="{{author}}">{{author}}</a></span>
</span>
</p>
<p><time datetime="{{item_pub_date}}" itemprop="datePublished">{{item_pub_date}}</time></p>
<p>Tags: {{tags}}</p>


{{content}}
</div>
</main>
Expand All @@ -204,36 +186,31 @@
<a href="/terms/index.html">Terms of Use</a>
</span>
</footer>
<script async crossorigin="anonymous"
integrity="sha512-ToL6UYWePxjhDQKNioSi4AyJ5KkRxY+F1+Fi7Jgh0Hp5Kk2/s8FD7zusJDdonfe5B00Qw+B8taXxF6CFLnqNCw=="
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js">
></script>
<script type="application/ld+json">
{"@context":"https://schema.org/","@type":"WebPage","author":{"@type":"Person","@id":"{{author}}"},"copyrightHolder":{"@type":"Person","@id":"{{author}}"},"copyrightYear":"{{copyright}}","creator":{"@type":"Person","@id":"{{author}}"},"dateModified":"{{last_build_date}}","datePublished":"{{item_pub_date}}","description":"{{description}}","headline":"{{subtitle}}","image":{"@type":"ImageObject","url":"{{image}}"},"inLanguage":"{{language}}","mainEntityOfPage":"{{permalink}}","name":"{{name}}","publisher":{"@type":"Person","@id":"{{author}}"}}
</script>
<script async crossorigin="anonymous" integrity="sha512-ToL6UYWePxjhDQKNioSi4AyJ5KkRxY+F1+Fi7Jgh0Hp5Kk2/s8FD7zusJDdonfe5B00Qw+B8taXxF6CFLnqNCw==" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" />
<script type="application/ld+json">{"@context":"https://schema.org/","@type":"WebPage","author":{"@type":"Person","@id":"{{author}}"},"copyrightHolder":{"@type":"Person","@id":"{{author}}"},"copyrightYear":"{{copyright}}","creator":{"@type":"Person","@id":"{{author}}"},"dateModified":"{{last_build_date}}","datePublished":"{{item_pub_date}}","description":"{{description}}","headline":"{{subtitle}}","image":{"@type":"ImageObject","url":"{{image}}"},"inLanguage":"{{language}}","mainEntityOfPage":"{{permalink}}","name":"{{name}}","publisher":{"@type":"Person","@id":"{{author}}"}}</script>
<script>
// This is an Immediately Invoked Function Expression (IIFE) which helps
// to avoid declaring any globals.
(function () {
// Create a new script element
var script = document.createElement("script");

// Set the source of the script element to "/main.js".
// A timestamp is appended as a query string to ensure the browser
// always fetches the latest version of the script, bypassing the
// cache.
script.src = "/main.js";

// The script is of type "text/javascript"
script.type = "text/javascript";

// The script is set to execute asynchronously as soon as it's
//available
script.async = true;

// Append the script element to the head of the document
document.head.appendChild(script);
})(); // The function is immediately invoked
// This is an Immediately Invoked Function Expression (IIFE) which helps
// to avoid declaring any globals.
(function () {
// Create a new script element
var script = document.createElement("script");

// Set the source of the script element to "/main.js".
// A timestamp is appended as a query string to ensure the browser
// always fetches the latest version of the script, bypassing the
// cache.
script.src = "/main.js";

// The script is of type "text/javascript"
script.type = "text/javascript";

// The script is set to execute asynchronously as soon as it's
//available
script.async = true;

// Append the script element to the head of the document
document.head.appendChild(script);
})(); // The function is immediately invoked
</script>
</body>

Expand Down

0 comments on commit c00d90d

Please sign in to comment.