Browse Source

feat(feature/custom-homepage): add custom homepage and docs in english

close #41
pull/198/head
Josh Habdas 1 year ago
parent
commit
87d207652e
Signed by: jhabdas GPG Key ID: B148B31154C75A74
16 changed files with 529 additions and 166 deletions
  1. +43
    -0
      assets/css/conditional/layout/home.css
  2. +16
    -0
      assets/css/conditional/layout/post/single.css
  3. +2
    -5
      assets/css/theme.css
  4. +1
    -0
      data/schema.toml
  5. +1
    -1
      docs/config.toml
  6. +25
    -25
      docs/content/_index.md
  7. +161
    -0
      docs/content/feature/custom-homepage.md
  8. BIN
      docs/static/images/screenshots/feature-homepage-fs8.png
  9. +0
    -1
      docs/themes/toxic-swamp
  10. +2
    -2
      layouts/_default/baseof.html
  11. +94
    -0
      layouts/_default/home.html
  12. +0
    -39
      layouts/index.html
  13. +80
    -0
      layouts/partials/image/header.html
  14. +79
    -0
      layouts/partials/image/thumbnail.html
  15. +19
    -14
      layouts/partials/page-summary.html
  16. +6
    -79
      layouts/post/single.html

+ 43
- 0
assets/css/conditional/layout/home.css View File

@ -0,0 +1,43 @@
/*!
* Copyright (C) 2019 Josh Habdas <jhabdas@protonmail.com>
*
* This file is part of After Dark.
*
* After Dark is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published
* by the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* After Dark is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
section ul.grid {
margin: 10px -10px;
}
section ul.grid li {
padding: 10px;
}
section ul.grid li h2 {
margin-bottom: 1rem;
}
section ul.grid li a figure:hover {
filter: brightness(1.1);
}
.hack section ul.grid li h2::before {
content: initial;
}
.hack section ul.grid li::after {
content: initial;
}
.standard section ol.grid,
.standard section ul.grid {
padding-left: 0px;
list-style-type: none;
display: flex;
}

+ 16
- 0
assets/css/conditional/layout/post/single.css View File

@ -0,0 +1,16 @@
.hack header figure[itemtype*="ImageObject"] {
position: relative;
}
.hack header figure[itemtype*="ImageObject"] figcaption {
position: absolute;
bottom: 0;
right: 0;
text-align: right;
padding: 15px;
font-style: oblique;
font-size: smaller;
mix-blend-mode: soft-light;
}
.hack header figure[itemtype*="ImageObject"] [itemprop="headline"] {
font-weight: bold;
}

+ 2
- 5
assets/css/theme.css View File

@ -134,7 +134,8 @@ html {
.hack blockquote:after {
line-height: 1.5;
}
.hack figure {
.hack figure,
.standard figure {
margin: unset;
}
.hack figure a {
@ -143,10 +144,6 @@ html {
.hack figure a:hover {
background-color: inherit;
}
article [itemprop="description"] {
margin-bottom: 20px;
margin-top: 20px;
}
article header img {
width: 100%;
border-radius: 3px;

+ 1
- 0
data/schema.toml View File

@ -0,0 +1 @@
article_types = ["Article", "AdvertiserContentArticle", "NewsArticle", "AnalysisNewsArticle", "AskPublicNewsArticle", "BackgroundNewsArticle", "OpinionNewsArticle", "ReportageNewsArticle", "ReviewNewsArticle", "Report", "SatiricalArticle", "ScholarlyArticle", "MedicalScholarlyArticle", "SocialMediaPosting", "BlogPosting", "LiveBlogPosting", "DiscussionForumPosting", "TechArticle", "APIReference"]

+ 1
- 1
docs/config.toml View File

@ -19,7 +19,7 @@
baseurl = "https://after-dark.habd.as/" # Controls base URL sitewide
title = "After Dark" # Homepage title and page title suffix
paginate = 36 # Number of items to show before paginating
paginate = 37 # Number of items to show before paginating
copyright = "Copyright &copy; Josh Habdas. Licensed under <a target=\"_blank\" rel=\"external noopener license\" href=\"https://www.gnu.org/licenses/agpl.html\">AGPL-3.0-or-later</a>."
# Controls default theme and theme components

+ 25
- 25
docs/content/_index.md View File

@ -55,7 +55,7 @@ images = [
<th scope="col" width="25%">Extras</th>
</tr>
<tr>
<td><a href="./feature/">36</a></td>
<td><a href="./feature/">37</a></td>
<td><a href="./module/">4</a></td>
<td><a href="./shortcode/">26+</a></td>
<td><a href="./extra/">2</a></td>
@ -63,6 +63,20 @@ images = [
</table>
</section>
<section id="feature-customize" class="feature">
<svg class="i-compose" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path d="M27 15 L27 30 2 30 2 5 17 5 M30 6 L26 2 9 19 7 25 13 23 Z M22 6 L26 10 Z M9 19 L13 23 Z" />
</svg>
<h2>Easily Customized</h2>
<p>Toggle between 1 of 8 <strong><i>customizable</i> skin styles</strong> or disable them entirely and use custom layouts and styles to take complete design control.</p>
<nav><p>
<a href="/feature/skin-styles/">Skins</a> |
<a href="/feature/custom-homepage/">Homepage</a> |
<a href="/feature/custom-styles/">Styles</a> |
<a href="/feature/#customizing">See All</a>
</p></nav>
</section>
<section id="feature-speed" class="feature">
<svg class="i-lightning" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path d="M18 13 L26 2 8 13 14 19 6 30 24 19 Z" />
@ -91,21 +105,6 @@ images = [
</p></nav>
</section>
<section id="feature-rewards" class="feature">
<svg class="i-creditcard" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path d="M2 7 L2 25 30 25 30 7 Z M5 18 L9 18 M5 21 L11 21" />
<path d="M2 11 L2 13 30 13 30 11 Z" fill="currentColor" />
</svg>
<h2 style="margin-bottom:0.2rem">Rewards System</h2>
<small><i style="color:lime">(Now in Beta!)</i></small>
<p>Earn rewards for keeping your software up-to-date and <strong>monetize attention</strong> to generate a <strong><i>borderless</i></strong>, low-maintenance & passive income.</p>
<nav><p>
<a href="/module/toxic-swamp/#installation">Installation</a> |
<a href="/module/toxic-swamp/#earning-rewards">Earning Rewards</a> |
<a href="/module/toxic-swamp/">Learn More</a>
</p></nav>
</section>
<section id="feature-search" class="feature">
<svg class="i-search" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<circle cx="14" cy="14" r="12" />
@ -119,17 +118,18 @@ images = [
</p></nav>
</section>
<section id="feature-customize" class="feature">
<svg class="i-compose" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path d="M27 15 L27 30 2 30 2 5 17 5 M30 6 L26 2 9 19 7 25 13 23 Z M22 6 L26 10 Z M9 19 L13 23 Z" />
<section id="feature-rewards" class="feature">
<svg class="i-creditcard" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="currentcolor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
<path d="M2 7 L2 25 30 25 30 7 Z M5 18 L9 18 M5 21 L11 21" />
<path d="M2 11 L2 13 30 13 30 11 Z" fill="currentColor" />
</svg>
<h2>Easily Customized</h2>
<p>Toggle between 1 of 8 <strong><i>customizable</i> skin styles</strong> or disable them entirely and use custom layouts and styles to take complete design control.</p>
<h2 style="margin-bottom:0.2rem">Rewards System</h2>
<small><i style="color:lime">(Now in Beta!)</i></small>
<p>Earn rewards for keeping your software up-to-date and <strong>monetize attention</strong> to generate a <strong><i>borderless</i></strong>, low-maintenance & passive income.</p>
<nav><p>
<a href="/feature/skin-styles/">Skins</a> |
<a href="/feature/custom-layouts/">Layouts</a> |
<a href="/feature/custom-styles/">Styles</a> |
<a href="/feature/svg-favicon/">Favicons</a>
<a href="/module/toxic-swamp/#installation">Installation</a> |
<a href="/module/toxic-swamp/#earning-rewards">Earning Rewards</a> |
<a href="/module/toxic-swamp/">Learn More</a>
</p></nav>
</section>

+ 161
- 0
docs/content/feature/custom-homepage.md View File

@ -0,0 +1,161 @@
+++
title = "Custom Homepage"
description = "Hide the blog and specify the content shown."
categories = ["customizing"]
tags = ["layout", "templating", "style"]
features = ["code highlighter", "snippets", "related content"]
[[copyright]]
owner = "Josh Habdas"
date = "2019"
license = "agpl-3.0-or-later"
+++
After Dark provides a configurable way to customize the content shown on your homepage without the need for creating a [Custom Layout](../custom-layouts). Use it to hide the blog and display recent content from various sections of your site.
{{< hackcss-alert >}}
{{< figure
src="/images/screenshots/feature-homepage-fs8.png"
>}}
{{< /hackcss-alert >}}
{{< hackcss-card header="Quick Example" >}}
{{< highlight toml "linenos=inline" >}}
[params.layout.home]
hide_blog = true
[[params.layout.home.section]]
type = "about"
weight = 1
[[params.layout.home.section]]
type = "code" # Required, name of section to show on homepage
limit = 4 # Optional, set number of items to show from section
weight = 2 # Optional, choose layout order for section
thumbs = ["fill", "400x400"] # Optional, thumbnail image processing
[[params.layout.home.section]]
type = "site"
limit = 2
weight = 3
[[params.layout.home.section]]
type = "post"
limit = 3
weight = 4
{{< /highlight >}}
{{< /hackcss-card >}}
Start by adding a section to display:
```toml
[[params.layout.home.section]]
type = "post"
```
Limit the number of items shown:
```toml
[[params.layout.home.section]]
type = "post"
limit = 3
```
Then hide the blog if you like:
```toml
[params.layout.home]
hide_blog = true
```
And use the space to add more sections:
```toml
[[params.layout.home.section]]
type = "post"
[[params.layout.home.section]]
type = "podcast"
```
Or even add stand-alone pages too:
```toml
[[params.layout.home.section]]
type = "about"
```
And display sections in order by weight:
```toml
[[params.layout.home.section]]
type = "about"
weight = 1
[[params.layout.home.section]]
type = "podcast"
weight = 2
```
Each section is output using generic [Structured Data](../structured-data):
```
Homepage
├── Thing
└── ItemList
├── Thing
├── Thing
└── Thing
```
And may be enhanced using front matter:
```
├── archetypes
├── content
│ └── about.md
│ └── podcast
│ ├── _index.md
│ ├── secrets-of-silicon-valley
│ ├── the-5g-dragnet
│ └── language-is-a-weapon
├── layouts
```
```toml
[schema]
type = "AboutPage" # inside about.md
```
```toml
[schema]
type = "Audiobook" # inside _index.md
```
Resulting in machine-readable structure:
```
Homepage
├── AboutPage
└── ItemList
├── Audiobook
├── Audiobook
└── Audiobook
```
Which can be further enhanced using thumbnail images, which are output automatically for any list item in any section using a [Post Images](../post-images) formatted resource bundle and containing the string `thumbnail`:
```toml
[[resources]]
src = "**hyperdrive-logo.png"
name = "header thumbnail"
```
Thumbnails output automatically when described in front-matter for any resource type in any section, and may be manipulated using {{< external "https://gohugo.io/content-management/image-processing/#readout" "Hugo Image Processing" />}} using the `thumbs` setting in any section:
```toml
[[params.layout.home.section]]
type = "code"
thumbs = ["fill", "400x400"]
```
Valid options are `fit`, `resize` and `fill`, and image dimensions may be omitted for a 4x3 aspect ratio thumbnail.

BIN
docs/static/images/screenshots/feature-homepage-fs8.png View File

Before After
Width: 1736  |  Height: 1040  |  Size: 248 KiB

+ 0
- 1
docs/themes/toxic-swamp View File

@ -1 +0,0 @@
../../../toxic-swamp

+ 2
- 2
layouts/_default/baseof.html View File

@ -17,11 +17,11 @@ You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/ -}}
<!DOCTYPE html>
<!doctype html>
<html lang="{{ .Site.LanguageCode }}">
<head>
{{ partial "meta/content-security-policy.html" . }}
<meta name="generator" content="Hugo">
<meta name="generator" content="After Dark Hugo">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ block "title" . }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>

+ 94
- 0
layouts/_default/home.html View File

@ -0,0 +1,94 @@
{{/*
Copyright (C) 2019 Josh Habdas <jhabdas@protonmail.com>
This file is part of After Dark.
After Dark is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
After Dark is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/}}
{{ define "title" -}}
{{ .Site.Title }}
{{- end }}
{{ define "header" }}
{{ partial "masthead.html" . }}
{{ end }}
{{ define "main" }}
{{ if ne .Site.Params.hackcss.disabled true }}
{{ with resources.Get "css/conditional/layout/home.css" | minify }}
<style>{{ .Content | safeCSS }}</style>
{{ end }}
{{ end }}
<header>
<h1 itemprop="name">{{ .Title }}</h1>
</header>
{{ with .Site.Params.layout.home.section }}
{{ range sort . "weight" "asc" }}
<section>
{{ $index := site.GetPage "section" .type }}
{{ $pages := where site.RegularPages "Type" .type }}
{{ $page_count := (default 1 (len $pages)) }}
{{ if eq $page_count 1 }}
{{ partial "page-summary.html" $index }}
{{ else if gt $page_count 1 }}
<header>
<h1 itemprop="name">
<a href="{{ $index.RelPermalink }}">Recent {{ $index.Title }}</a>
</h1>
<blockquote itemprop="description">{{ $index.Description }}</blockquote>
</header>
<ul class="grid" itemscope itemtype="https://schema.org/ItemList">
<meta itemprop="itemListOrder" content="Unordered">
<meta itemprop="name" content="{{ $index.Title }}">
<meta itemprop="numberOfItems" content="{{ (default $page_count .limit) }}">
{{ $thumbnail_options := .thumbs }}
{{ range first (default $page_count .limit) $pages }}
{{ $page_schema := .Params.schema }}
{{ $section_schema := (.Site.GetPage "section" .Page.Type).Params.schema }}
{{ $schema_type := (default $section_schema.type $page_schema.type) | default "Thing" }}
<li class="cell" itemprop="itemListElement" itemscope itemtype="https://schema.org/{{ $schema_type }}">
<a itemprop="url" href="{{ .RelPermalink }}">
{{ partial "image/thumbnail.html" (dict "node" . "options" $thumbnail_options) }}
<h2 itemprop="name">{{ .Title }}</h2>
</a>
<small itemprop="description">{{ .Description }}</small>
</li>
{{ end }}
</ul>
{{ end }}
{{ if and (lt .limit $page_count) (ne 1 $page_count) }}
<nav class="readmore">
<a itemprop="url" href="{{ $index.RelPermalink }}">
View more {{ $index.Title }}
</a>
</nav>
{{ end }}
</section>
{{ end }}
{{ end }}
{{ if not .Site.Params.layout.home.hide_blog }}
<section itemscope itemtype="https://schema.org/Blog">
{{ range (.Paginate (where .Data.Pages "Type" "in" (site.Params.layout.homepage.sections | default (slice "post")))).Pages }}
{{ partial "page-summary.html" . }}
{{ end }}
</section>
{{ end }}
{{ end }}
{{ define "footer" }}
{{ if not .Site.Params.layout.home.hide_blog }}
<p>{{ partial "pagination.html" . }}</p>
{{ end }}
<small class="muted">
{{ partial "copyright-notice.html" . }}
</small>
{{ end }}

+ 0
- 39
layouts/index.html View File

@ -1,39 +0,0 @@
{{/*
Copyright (C) 2019 Josh Habdas <jhabdas@protonmail.com>
This file is part of After Dark.
After Dark is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
After Dark is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/}}
{{ define "title" -}}
{{ .Site.Title }}
{{- end }}
{{ define "header" }}
{{ partial "masthead.html" . }}
{{ end }}
{{ define "main" }}
<header>
<h1>{{ .Title }}</h1>
</header>
{{ range (.Paginate (where .Data.Pages "Type" "post")).Pages }}
{{ partial "page-summary.html" . }}
{{ end }}
{{ end }}
{{ define "footer" }}
<p>{{ partial "pagination.html" . }}</p>
<small class="muted">
{{ partial "copyright-notice.html" . }}
</small>
{{ end }}

+ 80
- 0
layouts/partials/image/header.html View File

@ -0,0 +1,80 @@
{{/*
Copyright (C) 2019 Josh Habdas <jhabdas@protonmail.com>
This file is part of After Dark.
After Dark is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
After Dark is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/}}
{{ with $.Resources.GetMatch "*header*" }}
{{ $meta_sameas := .Params.meta.sameas }}
{{ $meta_license := .Params.meta.license }}
{{ $meta_creator := .Params.meta.creator }}
{{ $meta_description := .Params.meta.description }}
{{ $meta_keywords := .Params.meta.keywords }}
{{ $meta_contentlocation := .Params.meta.contentlocation }}
{{ $image600 := .Fill "600x338 q60 Center" }}
{{ $image900 := .Fill "900x506 q70 Center" }}
{{ $image1200 := .Fill "1200x675 q80 Center" }}
{{ $image1600 := .Fill "1600x900 q90 Center" }}
<figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
<link itemprop="contentUrl" href="{{ .RelPermalink }}">
<meta itemprop="encodingFormat" content="{{ .MediaType }}">
<meta itemprop="name" content="{{ .Name | plainify }}">
{{ if (urls.Parse $meta_sameas).Host }}
<link itemprop="sameAs" href="{{ $meta_sameas }}">
{{ end }}
{{ if (urls.Parse $meta_license).Host }}
<link itemprop="license" href="{{ $meta_license }}">
{{ end }}
{{ with $meta_keywords }}
<meta itemprop="keywords" content="{{ delimit . ", " }}">
{{ end }}
{{ with $meta_contentlocation }}
<meta itemprop="contentLocation" content="{{ . | plainify }}">
{{ end }}
{{ with $meta_description }}
<meta itemprop="description" content="{{ . | plainify }}">
{{ end }}
<img
itemprop="thumbnailUrl"
alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
class="lazyload blur-up"
src="{{ $image600.RelPermalink }}"
data-sizes="auto"
data-src="{{ $image1200.RelPermalink }}"
data-srcset="{{ $image600.RelPermalink }} 600w, {{ $image900.RelPermalink }} 900w, {{ $image1200.RelPermalink }} 1200w, {{ $image1600.RelPermalink }} 1600w"
>
{{ if or (not (path.Ext .Title)) (or $meta_creator $meta_sameas) }}
<figcaption itemprop="caption">
{{ if not (path.Ext .Title) }}
<span itemprop="headline">{{ .Title | plainify }}</span>.
{{ end }}
{{ if or $meta_creator $meta_sameas }}
Photo
{{ if $meta_creator }}
by
<span itemprop="creator">
{{ $meta_creator | plainify -}}
</span>
{{- end }}
{{- with (urls.Parse $meta_sameas).Host }}
on
{{ (strings.TrimSuffix (path.Ext .) .) | title }}
{{- end }}.
{{ end }}
</figcaption>
{{ end }}
</figure>
{{ end }}

+ 79
- 0
layouts/partials/image/thumbnail.html View File

@ -0,0 +1,79 @@
{{/*
Copyright (C) 2019 Josh Habdas <jhabdas@protonmail.com>
This file is part of After Dark.
After Dark is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
After Dark is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/}}
{{ $valid_processing_methods := (slice "resize" "fit" "fill") }}
{{ $options := .options | default slice }}
{{ $image_processing_method := default "fill" (index $options 0) }}
{{ $image_processing_options := index $options 1 }}
{{ if not (in $valid_processing_methods $image_processing_method) }}
{{ errorf "Invalid thumbnail processing method: Must be one of 'fit', 'fill' or 'resize'." }}
{{ else }}
{{ $scratch := newScratch }}
{{ with .node.Resources.GetMatch "*thumbnail*" }}
{{ $meta_sameas := .Params.meta.sameas }}
{{ $meta_license := .Params.meta.license }}
{{ $meta_creator := .Params.meta.creator }}
{{ $meta_description := .Params.meta.description }}
{{ $meta_keywords := .Params.meta.keywords }}
{{ $meta_contentlocation := .Params.meta.contentlocation }}
{{ if (eq $image_processing_method "resize") }}
{{ $scratch.Set "lodpi" (.Resize (default "400x300 q60 Gaussian" $image_processing_options)) }}
{{ $scratch.Set "hidpi" (.Resize (printf "%dx%d q90 Gaussian" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
{{ else if (eq $image_processing_method "fit") }}
{{ $scratch.Set "lodpi" (.Fit (default "400x300" $image_processing_options)) }}
{{ $scratch.Set "hidpi" (.Fit (printf "%dx%d" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
{{ else }}
{{ $scratch.Set "lodpi" (.Fill (default "400x300 Center" $image_processing_options)) }}
{{ $scratch.Set "hidpi" (.Fill (printf "%dx%d Center" (mul ($scratch.Get "lodpi").Width 2) (mul ($scratch.Get "lodpi").Height 2))) }}
{{ end }}
<figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
<link itemprop="contentUrl" href="{{ .RelPermalink }}">
<meta itemprop="encodingFormat" content="{{ .MediaType }}">
<meta itemprop="name" content="{{ .Name | plainify }}">
{{ with .Title }}
<meta itemprop="headline" content="{{ . }}">
{{ end }}
{{ with $meta_creator }}
<meta itemprop="creator" content="{{ . | plainify -}}">
{{ end }}
{{ if (urls.Parse $meta_sameas).Host }}
<link itemprop="sameAs" href="{{ $meta_sameas }}">
{{ end }}
{{ if (urls.Parse $meta_license).Host }}
<link itemprop="license" href="{{ $meta_license }}">
{{ end }}
{{ with $meta_keywords }}
<meta itemprop="keywords" content="{{ delimit . ", " }}">
{{ end }}
{{ with $meta_contentlocation }}
<meta itemprop="contentLocation" content="{{ . | plainify }}">
{{ end }}
{{ with $meta_description }}
<meta itemprop="description" content="{{ . | plainify }}">
{{ end }}
<img
itemprop="thumbnailUrl"
alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
class="lazyload blur-up"
src="{{ ($scratch.Get "lodpi").RelPermalink }}"
data-src="{{ ($scratch.Get "hidpi").RelPermalink }}"
>
</figure>
{{ end }}
{{ end }}

+ 19
- 14
layouts/partials/page-summary.html View File

@ -17,26 +17,26 @@ You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/ -}}
<article itemprop="citation" itemscope itemtype="https://schema.org/CreativeWork">
{{ $page_schema := .Params.schema }}
{{ $section_schema := (.Site.GetPage "section" .Page.Type).Params.schema }}
{{ $schema_type := (default $section_schema.type $page_schema.type) | default "Thing" }}
{{ $article_types := .Site.Data.schema.article_types }}
{{ $is_typeof_article := in $article_types $schema_type }}
<article itemprop="citation{{ if eq $schema_type "BlogPosting" }} blogPost{{ end }}" itemscope itemtype="https://schema.org/{{ $schema_type }}" id="{{ .Title | anchorize }}">
<header>
<h2 itemprop="name">
<a href="{{ .RelPermalink }}" rel="bookmark">{{ .Title }}</a>
</h2>
<h1 itemprop="{{ if $is_typeof_article }}headline{{ else }}name{{ end }}">
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
</h1>
{{ if eq .Type "post" }}
<p class="muted">{{ partial "post/meta.html" . }}</p>
{{ end }}
{{ if .Description }}
<blockquote itemprop="headline">{{ .Description }}</blockquote>
{{ end }}
</header>
{{ if .Description }}
<blockquote itemprop="headline">{{ .Description }}</blockquote>
{{ end }}
<div itemprop="description">
{{ .Summary }}
<div itemprop="{{ if $is_typeof_article }}articleBody mainEntityOfPage{{ end }}">
{{- .Summary -}}
</div>
{{ if .Truncated }}
<nav class="readmore"><p>
<a itemprop="url" href="{{ .RelPermalink }}" rel="bookmark">Read More&nbsp;&raquo;</a>
</p></nav>
{{ end }}
<meta itemprop="inLanguage" content="{{ .Site.LanguageCode }}">
<meta itemprop="datePublished" content="{{ dateFormat "2006-01-02T15:04:05-07:00" (default .Date (.PublishDate)) }}">
<meta itemprop="dateModified" content="{{ .Lastmod.Format "2006-01-02T15:04:05-07:00" }}">
@ -44,3 +44,8 @@ along with this program. If not, see .
<meta itemprop="image" content="{{ index . 0 }}">
{{ end }}
</article>
{{ if .Truncated }}
<nav class="readmore">
<a itemprop="url" href="{{ .RelPermalink }}">Read More&nbsp;&raquo;</a>
</nav>
{{ end }}

+ 6
- 79
layouts/post/single.html View File

@ -21,6 +21,11 @@ along with this program. If not, see .
{{ partial "masthead.html" . }}
{{ end }}
{{ define "main" }}
{{ if ne $.Site.Params.hackcss.disabled true }}
{{ with resources.Get "css/conditional/layout/post/single.css" | minify }}
<style>{{ .Content | safeCSS }}</style>
{{ end }}
{{ end }}
<article itemscope itemtype="https://schema.org/BlogPosting">
{{ template "_internal/schema.html" . }}
<header>
@ -31,85 +36,7 @@ along with this program. If not, see .
{{ if .Description }}
<blockquote itemprop="description">{{ .Description }}</blockquote>
{{ end }}
{{ with $.Resources.GetMatch "header" }}
{{ $meta_sameas := .Params.meta.sameas }}
{{ $meta_license := .Params.meta.license }}
{{ $meta_creator := .Params.meta.creator }}
{{ $meta_description := .Params.meta.description }}
{{ $meta_keywords := .Params.meta.keywords }}
{{ $meta_contentlocation := .Params.meta.contentlocation }}
{{ $image600 := .Fill "600x338 q60 Center" }}
{{ $image900 := .Fill "900x506 q70 Center" }}
{{ $image1200 := .Fill "1200x675 q80 Center" }}
{{ $image1600 := .Fill "1600x900 q90 Center" }}
<figure aria-hidden="true" itemscope itemtype="https://schema.org/ImageObject">
<link itemprop="contentUrl" href="{{ .RelPermalink }}">
<meta itemprop="encodingFormat" content="{{ .MediaType }}">
<meta itemprop="name" content="{{ .Name | plainify }}">
{{ if (urls.Parse $meta_sameas).Host }}
<link itemprop="sameAs" href="{{ $meta_sameas }}">
{{ end }}
{{ if (urls.Parse $meta_license).Host }}
<link itemprop="license" href="{{ $meta_license }}">
{{ end }}
{{ with $meta_keywords }}
<meta itemprop="keywords" content="{{ delimit . ", " }}">
{{ end }}
{{ with $meta_contentlocation }}
<meta itemprop="contentLocation" content="{{ . | plainify }}">
{{ end }}
{{ with $meta_description }}
<meta itemprop="description" content="{{ . | plainify }}">
{{ end }}
<img
itemprop="thumbnailUrl"
alt="{{ with $meta_description }}{{ . }}{{ else }}{{ .Name | plainify }}{{ end }}"
class="lazyload blur-up"
src="{{ $image600.RelPermalink }}"
data-sizes="auto"
data-src="{{ $image1200.RelPermalink }}"
data-srcset="{{ $image600.RelPermalink }} 600w, {{ $image900.RelPermalink }} 900w, {{ $image1200.RelPermalink }} 1200w, {{ $image1600.RelPermalink }} 1600w"
>
{{ if or (not (path.Ext .Title)) (or $meta_creator $meta_sameas) }}
<style>
.hack header figure[itemtype*="ImageObject"] {
position: relative;
}
.hack header figure[itemtype*="ImageObject"] figcaption {
position: absolute;
bottom: 0;
right: 0;
text-align: right;
padding: 15px;
font-style: oblique;
font-size: smaller;
mix-blend-mode: soft-light;
}
.hack header figure[itemtype*="ImageObject"] [itemprop="headline"] {
font-weight: bold;
}
</style>
<figcaption itemprop="caption">
{{ if not (path.Ext .Title) }}
<span itemprop="headline">{{ .Title | plainify }}</span>.
{{ end }}
{{ if or $meta_creator $meta_sameas }}
Photo
{{ if $meta_creator }}
by
<span itemprop="creator">
{{ $meta_creator | plainify -}}
</span>
{{- end }}
{{- with (urls.Parse $meta_sameas).Host }}
on
{{ (strings.TrimSuffix (path.Ext .) .) | title }}
{{- end }}.
{{ end }}
</figcaption>
{{ end }}
</figure>
{{ end }}
{{ partial "image/header.html" . }}
</header>
{{ partial "toc-maybe.html" . }}
<div itemprop="articleBody">

Loading…
Cancel
Save