Add blog section with summary display on listing page

content/blog/_index.md

@@ -0,0 +1,5 @@
+---
+title: "Blogs"
+description: "Latest updates and articles"
+DisplayBreadCrumbs: true
+---

hugo.toml

@@ -10,3 +10,8 @@ favicon = "https://avatars.githubusercontent.com/u/29598503?s=128"
 
 [markup.goldmark.renderer]
 unsafe = true
+
+summaryLength = 70
+enableEmoji = true
+[taxonomies]
+  tag = "tags"

layouts/_default/term.html

@@ -0,0 +1,60 @@
+{{- define "main" }}
+<div class="blog-list-container">
+  {{- if not .IsHome | and .Title }}
+  <header class="blog-header">
+    {{ partial "breadcrumbs-for-tags.html" . }}
+    <h1 class="blog-page-title">{{ .Title }}</h1>
+    {{- if .Description }}
+    <div class="blog-page-description">
+      {{ .Description | markdownify | emojify | safeHTML}}
+    </div>
+    {{- end }}
+  </header>
+  {{- end }}
+
+  {{- if .Content }}
+  <div class="blog-content">
+    {{ .Content }}
+  </div>
+  {{- end }}
+
+  {{- $pages := slice }}
+  {{- if .IsHome }}
+  {{- $sections := site.Params.mainSections | default (slice "tags") }}
+  {{- range site.RegularPages }}
+  {{- if (and (in $sections .Section) (not .Params.hiddenInHomeList)) }}
+  {{- $pages = $pages | append . }}
+  {{- end }}
+  {{- end }}
+  {{- else }}
+  {{- $pages = .RegularPages }}
+  {{- end }}
+
+  {{- $paginator := .Paginate $pages }}
+
+  {{- range $paginator.Pages }}
+  <article class="blog-card">
+    <a class="blog-card-link-wrapper" href="{{ .Permalink }}">
+      <header class="blog-card-header">
+        <h2 class="blog-card-title">
+          {{ .Title | emojify | safeHTML }}
+          {{- if .Draft }} <span class="draft-badge">[Draft]</span> {{- end }}
+        </h2>
+      </header>
+
+      {{- if not .Params.hideSummary }}
+      <div class="blog-card-summary">
+        <p>{{ .Summary | plainify | htmlUnescape | emojify | truncate 250 | safeHTML}}{{ if .Truncated }}...{{ end }}</p>
+      </div>
+      {{- end }}
+
+      {{- if not .Params.hideMeta }}
+      <footer class="blog-card-meta">
+        {{- partial "blog-only-date.html" . }}
+      </footer>
+      {{- end }}
+    </a>
+  </article>
+  {{- end }}
+</div>
+{{- end }}

layouts/blog/list.html

@@ -0,0 +1,60 @@
+{{- define "main" }}
+<div class="blog-list-container">
+  {{- if not .IsHome | and .Title }}
+  <header class="blog-header">
+    {{ partial "breadcrumbs.html" . }}
+    <h1 class="blog-page-title">{{ .Title }}</h1>
+    {{- if .Description }}
+    <div class="blog-page-description">
+      {{ .Description | markdownify | emojify | safeHTML}}
+    </div>
+    {{- end }}
+  </header>
+  {{- end }}
+
+  {{- if .Content }}
+  <div class="blog-content">
+    {{ .Content | markdownify | emojify | safeHTML}}
+  </div>
+  {{- end }}
+
+  {{- $pages := slice }}
+  {{- if .IsHome }}
+    {{- $sections := site.Params.mainSections | default (slice "blogs") }}
+    {{- range site.RegularPages }}
+      {{- if (and (in $sections .Section) (not .Params.hiddenInHomeList)) }}
+        {{- $pages = $pages | append . }}
+      {{- end }}
+    {{- end }}
+  {{- else }}
+    {{- $pages = .RegularPages }}
+  {{- end }}
+
+  {{- $paginator := .Paginate $pages }}
+
+  {{- range $paginator.Pages }}
+  <article class="blog-card">
+    <a class="blog-card-link-wrapper" href="{{ .Permalink }}">
+      <header class="blog-card-header">
+        <h2 class="blog-card-title">
+          {{ .Title | emojify | safeHTML }}
+          {{- if .Draft }} <span class="draft-badge">[Draft]</span> {{- end }}
+        </h2>
+      </header>
+
+      {{- if not .Params.hideSummary }}
+      <div class="blog-card-summary">
+        <p>{{ .Summary | plainify | htmlUnescape | emojify | truncate 250 | safeHTML}}{{ if .Truncated }}...{{ end }}</p>
+      </div>
+      {{- end }}
+
+      {{- if not .Params.hideMeta }}
+      <footer class="blog-card-meta">
+        {{- partial "blog-only-date.html" . }}
+      </footer>
+      {{- end }}
+    </a>
+  </article>
+  {{- end }}
+</div>
+{{- end }}

layouts/blog/single.html

@@ -0,0 +1,43 @@
+{{- define "main" }}
+<div class="blog-single-container">
+  <div class="">
+    <article class="">
+      <header class="blog-header">
+        {{ partial "breadcrumbs.html" . }}
+        <h1 class="blog-page-title">
+          {{ .Title | emojify | safeHTML}}
+        </h1>
+        {{- if (.Param "DisplayMeta") }}
+        <div class="blog-meta">
+          {{- partial "blog-meta.html" . -}}
+        </div>
+        {{- end }}
+        {{- if (.Param "DisplayCanonicalLink") }}
+        <div class="">
+          {{- partial "blog-canonical.html" . -}}
+        </div>
+        {{- end }}
+      </header>
+      {{- if (.Param "ShowToc") }}
+      {{- partial "blog-table-of-content.html" . }}
+      {{- end }}
+      {{- if .Content }}
+      <div class="">
+        {{ .Content | emojify | safeHTML}}
+      </div>
+      {{- end }}
+      <footer class="blog-footer">
+        {{- $tags := "tags" }}
+        <ul class="tag-list">
+          {{- range ($.GetTerms $tags) }}
+          <li class="tag-card"><a href="{{ .Permalink }}">{{ .LinkTitle }}</a></li>
+          {{- end }}
+        </ul>
+        {{- if (.Param "ShowFooterNav") }}
+        {{- partial "blog-footer-nav.html" . }}
+        {{- end }}
+      </footer>
+    </article>
+  </div>
+</div>
+{{- end }}

layouts/partials/blog-author.html

@@ -0,0 +1,10 @@
+{{- if (or .Params.author site.Params.author) -}}
+    {{- $author := (.Params.author | default site.Params.author) -}}
+    {{- $authorType := printf "%T" $author -}}
+
+    {{- if (or (eq $authorType "[]string") (eq $authorType "[]interface {}")) -}}
+        {{- delimit $author ", " -}}
+    {{- else -}}
+        {{- $author -}}
+    {{- end -}}
+{{- end -}}

layouts/partials/blog-canonical.html

@@ -0,0 +1,8 @@
+{{ if and (.Params.CanonicalLink) (.Params.DisplayCanonicalLink ) -}}
+{{ $url := urls.Parse .Params.CanonicalLink }}
+
+<span class="blog-canonical">
+    {{- (site.Params.CanonicalLinkText | default .Params.CanonicalLinkText) | default "Read more at" -}}
+    &nbsp;<a href="{{ trim .Params.CanonicalLink " " }}" title="{{ trim .Params.CanonicalLink " " }}" target="_blank" rel="noopener noreferrer">{{ $url.Host }}</a>
+</span>
+{{- end }}

layouts/partials/blog-footer-nav.html

@@ -0,0 +1,20 @@
+{{- $filteredPages := where site.RegularPages "Type" "in" site.Params.mainSections }}
+{{- if and (gt (len $filteredPages) 1) (in $filteredPages .) }}
+<nav class="footer-nav-card">
+  {{- with $filteredPages.Next . }}
+  <a class="footer-nav-link footer-nav-prev" href="{{ .Permalink }}">
+    <span class="footer-nav-text">{{ i18n "prev_page" }}</span>
+    <br>
+    <span class="footer-nav-title">{{ .Name | truncate 30 }}</span>
+  </a>
+  {{- end }}
+
+  {{- with $filteredPages.Prev . }}
+  <a class="footer-nav-link footer-nav-next" href="{{ .Permalink }}">
+    <span class="footer-nav-text">{{ i18n "next_page" }}</span>
+    <br>
+    <span class="footer-nav-title">{{ .Name | truncate 30 }}</span>
+  </a>
+  {{- end }}
+</nav>
+{{- end }}

layouts/partials/blog-meta.html

@@ -0,0 +1,26 @@
+{{- $scratch := newScratch }}
+
+{{- if not .Date.IsZero -}}
+    {{- $dateFormatted := printf "<span title='%s'>%s</span>" (.Date) (.Date | time.Format (default "January 2, 2006" site.Params.DateFormat)) }}
+    {{- $scratch.Add "meta" (slice $dateFormatted) }}
+{{- end -}}
+
+{{- if (.Param "ReadingTime") -}}
+    {{- $readingTime := i18n "read_time" .ReadingTime | default (printf "%d min" .ReadingTime) }}
+    {{- $scratch.Add "meta" (slice $readingTime) }}
+{{- end -}}
+
+{{- if (.Param "WordCount") -}}
+    {{- $wordCount := i18n "words" .WordCount | default (printf "%d words" .WordCount) }}
+    {{- $scratch.Add "meta" (slice $wordCount) }}
+{{- end -}}
+
+{{- if not (.Param "HideAuthor") -}}
+    {{- with (partial "blog-author.html" .) }}
+        {{- $scratch.Add "meta" (slice .) }}
+    {{- end -}}
+{{- end -}}
+
+{{- with ($scratch.Get "meta") -}}
+    {{- delimit . "&nbsp;·&nbsp;" | safeHTML -}}
+{{- end -}}

layouts/partials/blog-only-date.html

@@ -0,0 +1,4 @@
+{{- $scratch := newScratch }}
+{{- if not .Date.IsZero -}}
+    <span title="{{ .Date }}">{{ .Date | time.Format "January 2, 2006 15:04" }}</span>
+{{- end -}}

layouts/partials/blog-table-of-content.html

@@ -0,0 +1,39 @@
+{{- $headers := findRE "<h[1-6].*?>(.|\n])+?</h[1-6]>" .Content -}}
+{{- $has_headers := ge (len $headers) 1 -}}
+{{- if $has_headers -}}
+<div class="toc-card">
+    <details {{ if (.Param "DefaultOpenTOC" ) }} open{{ end }}>
+        <summary accesskey="z">
+            <span class="toc-title">{{ "Table of Contents" }}</span>
+        </summary>
+
+        <div class="toc-content">
+            {{- $headerLevels := slice -}}
+            {{- $.Scratch.Set "currentLevel" 1 -}}
+
+            <ul class="toc-list">
+                {{- range $i, $header := $headers -}}
+                {{- $headerLevel := len (seq (index (findRE "[1-6]" . 1) 0)) -}}
+                {{- $cleanedID := replaceRE ".*id=\"([^\"]+)\".*" "$1" $header -}}
+                {{- if lt $headerLevel ($.Scratch.Get "currentLevel") }}
+            </ul>
+            {{- else if gt $headerLevel ($.Scratch.Get "currentLevel") }}
+            <ul>
+                {{- end -}}
+
+                <li class="toc-item">
+                    <a href="#{{- $cleanedID }}" aria-label="{{- $header | plainify | safeHTML }}">
+                        {{- $header | plainify | safeHTML }}
+                    </a>
+                </li>
+
+                {{- $.Scratch.Set "currentLevel" $headerLevel -}}
+                {{- end -}}
+                {{- range seq ($.Scratch.Get "currentLevel") 1 -}}
+            </ul>
+            {{- end -}}
+            </ul>
+        </div>
+    </details>
+</div>
+{{- end }}

layouts/partials/breadcrumbs-for-tags.html

@@ -0,0 +1,22 @@
+<div class="breadcrumbs">
+    {{- $url := replace .Permalink (printf "%s" site.Home.Permalink) "" -}}
+    {{- $lang_url := strings.TrimPrefix (printf "%s/" .Lang) $url -}}
+
+    <a href="{{ "" | absLangURL }}">
+      {{ i18n "home" | default "Home" }}
+    </a>
+
+    {{- $scratch := newScratch -}}
+    {{- range $index, $element := split $lang_url "/" -}}
+        {{- if and (ne $element "tags") (gt (len $element) 0) -}}
+            {{- $scratch.Add "path" (printf "%s/" $element ) -}}
+            {{- $bc_pg := site.GetPage ($scratch.Get "path") -}}
+            {{- if $bc_pg -}}
+                {{- print "&nbsp;&nbsp;" | safeHTML -}}
+                <a href="{{ $bc_pg.Permalink }}">
+                  {{ $bc_pg.Name }}
+                </a>
+            {{- end -}}
+        {{- end -}}
+    {{- end -}}
+</div>

layouts/partials/breadcrumbs.html

@@ -0,0 +1,22 @@
+{{- if (.Param "DisplayBreadCrumbs") -}}
+<div class="breadcrumbs">
+    {{- $url := replace .Permalink (printf "%s" site.Home.Permalink) "" -}}
+    {{- $lang_url := strings.TrimPrefix (printf "%s/" .Lang) $url -}}
+
+    <a href="{{ "" | absLangURL }}">
+      {{ i18n "home" | default "Home" }}
+    </a>
+
+    {{- $scratch := newScratch -}}
+    {{- range $index, $element := split $lang_url "/" -}}
+      {{- $scratch.Add "path" (printf "%s" $element ) -}}
+      {{- $bc_pg := site.GetPage ($scratch.Get "path") -}}
+      {{- if (and ($bc_pg) (gt (len . ) 0)) -}}
+        {{- print "&nbsp;&nbsp;" | safeHTML -}}
+        <a href="{{ $bc_pg.Permalink }}">
+          {{ $bc_pg.Name }}
+        </a>
+      {{- end -}}
+    {{- end -}}
+</div>
+{{- end -}}