Skip to content

Commit ecb5af7

Browse files
committed
Enable post preview for a less dull experience
This will be used, along with other Open Graph (OG) metadata, for rich preview cards on sites like Discord, Twitter/X, Slack, LinkedIn, etc. - Title (og:title) - Description (og:description) - Preview image (og:image) - Site name (og:site_name) - URL (og:url) To prevent the card's 'image:' from the front matter to be used by Chirpy as a "hero image" in the post, we override the default post layout and add a per-post image setting 'show_in_post: false'. Signed-off-by: Joachim Wiberg <troglobit@gmail.com>
1 parent 4c1007c commit ecb5af7

14 files changed

+208
-0
lines changed

_layouts/post.html

Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
---
2+
layout: default
3+
refactor: true
4+
panel_includes:
5+
- toc
6+
tail_includes:
7+
- related-posts
8+
- post-nav
9+
script_includes:
10+
- comment
11+
---
12+
13+
{% include lang.html %}
14+
15+
<article class="px-1">
16+
<header>
17+
<h1 data-toc-skip>{{ page.title }}</h1>
18+
{% if page.description %}
19+
<p class="post-desc fw-light mb-4">{{ page.description }}</p>
20+
{% endif %}
21+
22+
<div class="post-meta text-muted">
23+
<!-- published date -->
24+
<span>
25+
{{ site.data.locales[lang].post.posted }}
26+
{% include datetime.html date=page.date tooltip=true lang=lang %}
27+
</span>
28+
29+
<!-- lastmod date -->
30+
{% if page.last_modified_at and page.last_modified_at != page.date %}
31+
<span>
32+
{{ site.data.locales[lang].post.updated }}
33+
{% include datetime.html date=page.last_modified_at tooltip=true lang=lang %}
34+
</span>
35+
{% endif %}
36+
37+
{% if page.image and page.image.show_in_post != false %}
38+
{% capture src %}src="{{ page.image.path | default: page.image }}"{% endcapture %}
39+
{% capture class %}class="preview-img{% if page.image.no_bg %}{{ ' no-bg' }}{% endif %}"{% endcapture %}
40+
{% capture alt %}alt="{{ page.image.alt | xml_escape | default: "Preview Image" }}"{% endcapture %}
41+
42+
{% if page.image.lqip %}
43+
{%- capture lqip -%}lqip="{{ page.image.lqip }}"{%- endcapture -%}
44+
{% endif %}
45+
46+
<div class="mt-3 mb-3">
47+
<img {{ src }} {{ class }} {{ alt }} w="1200" h="630" {{ lqip }}>
48+
{%- if page.image.alt -%}
49+
<figcaption class="text-center pt-2 pb-2">{{ page.image.alt }}</figcaption>
50+
{%- endif -%}
51+
</div>
52+
{% endif %}
53+
54+
<div class="d-flex justify-content-between">
55+
<!-- author(s) -->
56+
<span>
57+
{% if page.author %}
58+
{% assign authors = page.author %}
59+
{% elsif page.authors %}
60+
{% assign authors = page.authors %}
61+
{% endif %}
62+
63+
{{ site.data.locales[lang].post.written_by }}
64+
65+
<em>
66+
{% if authors %}
67+
{% for author in authors %}
68+
{% if site.data.authors[author].url -%}
69+
<a href="{{ site.data.authors[author].url }}">{{ site.data.authors[author].name }}</a>
70+
{%- else -%}
71+
{{ site.data.authors[author].name }}
72+
{%- endif %}
73+
{% unless forloop.last %}{{ '</em>, <em>' }}{% endunless %}
74+
{% endfor %}
75+
{% else %}
76+
<a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>
77+
{% endif %}
78+
</em>
79+
</span>
80+
81+
<div>
82+
<!-- pageviews -->
83+
{% if site.pageviews.provider and site.analytics[site.pageviews.provider].id %}
84+
<span>
85+
<em id="pageviews">
86+
<i class="fas fa-spinner fa-spin small"></i>
87+
</em>
88+
{{ site.data.locales[lang].post.pageview_measure }}
89+
</span>
90+
{% endif %}
91+
92+
<!-- read time -->
93+
{% include read-time.html content=content prompt=true lang=lang %}
94+
</div>
95+
</div>
96+
</div>
97+
</header>
98+
99+
<div class="content">
100+
{{ content }}
101+
</div>
102+
103+
<div class="post-tail-wrapper text-muted">
104+
<!-- categories -->
105+
{% if page.categories.size > 0 %}
106+
<div class="post-meta mb-3">
107+
<i class="far fa-folder-open fa-fw me-1"></i>
108+
{% for category in page.categories %}
109+
<a href="{{ site.baseurl }}/categories/{{ category | slugify | url_encode }}/">{{ category }}</a>
110+
{%- unless forloop.last -%},{%- endunless -%}
111+
{% endfor %}
112+
</div>
113+
{% endif %}
114+
115+
<!-- tags -->
116+
{% if page.tags.size > 0 %}
117+
<div class="post-tags">
118+
<i class="fa fa-tags fa-fw me-1"></i>
119+
{% for tag in page.tags %}
120+
<a
121+
href="{{ site.baseurl }}/tags/{{ tag | slugify | url_encode }}/"
122+
class="post-tag no-text-decoration"
123+
>
124+
{{- tag -}}
125+
</a>
126+
{% endfor %}
127+
</div>
128+
{% endif %}
129+
130+
<div
131+
class="
132+
post-tail-bottom
133+
d-flex justify-content-between align-items-center mt-5 pb-2
134+
"
135+
>
136+
<div class="license-wrapper">
137+
{% if site.data.locales[lang].copyright.license.template %}
138+
{% capture _replacement %}
139+
<a href="{{ site.data.locales[lang].copyright.license.link }}">
140+
{{ site.data.locales[lang].copyright.license.name }}
141+
</a>
142+
{% endcapture %}
143+
144+
{{ site.data.locales[lang].copyright.license.template | replace: ':LICENSE_NAME', _replacement }}
145+
{% endif %}
146+
</div>
147+
148+
{% include post-sharing.html lang=lang %}
149+
</div>
150+
<!-- .post-tail-bottom -->
151+
</div>
152+
<!-- div.post-tail-wrapper -->
153+
</article>

_posts/2024-01-30-ospf-unnumbered-infix.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ title: OSPF Unnumbered Interfaces
33
author: vatn
44
date: 2024-01-30 17:06:42 +0200
55
tags: [networking, ospf]
6+
image:
7+
path: /assets/img/ospf-unnumbered-fig1.svg
8+
alt: OSPF unnumbered interfaces network diagram
9+
show_in_post: false
610
---
711

812
This post explains how to use *Unnumbered Interfaces* to simplify OSPF

_posts/2024-03-08-containers.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ author: troglobit
44
date: 2024-03-08 15:44:42 +0100
55
categories: [showcase]
66
tags: [container, containers, docker, podman]
7+
image:
8+
path: /assets/img/docker.webp
9+
alt: Docker whale
10+
show_in_post: false
711
---
812

913
![Docker whale](/assets/img/docker.webp){: width="200" .right}

_posts/2024-03-11-advanced-containers.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ author: troglobit
44
date: 2024-03-11 14:11:50 +0100
55
categories: [showcase]
66
tags: [container, containers, docker, podman]
7+
image:
8+
path: /assets/img/docker.webp
9+
alt: Docker whale
10+
show_in_post: false
711
---
812

913
![Docker whale](/assets/img/docker.webp){: width="200" .right}

_posts/2024-03-12-firewall-container.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ date: 2024-03-12 08:08:41 +0100
55
last_modified_at: 2026-02-27 12:00:00 +0100
66
categories: [showcase]
77
tags: [container, containers, networking, firewall, docker, podman]
8+
image:
9+
path: /assets/img/docker.webp
10+
alt: Docker whale
11+
show_in_post: false
812
---
913

1014
![Docker whale](/assets/img/docker.webp){: width="200" .right}

_posts/2024-07-26-mascot.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ date: 2024-07-26 06:31:00 +0100
55
categories: [misc]
66
tags: [mascot, jack, jacky]
77
pin: false
8+
image:
9+
path: /assets/img/jack.png
10+
alt: Jack, or Jacky
11+
show_in_post: false
812
---
913

1014
If you didn't know this already, our RJ45-dwelling penguin 🐧 mascot is

_posts/2024-08-13-router-boards.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@ last_modified_at: 2026-03-08 10:00:00 +0100
66
categories: [showcase]
77
tags: [boards]
88
pin: true
9+
image:
10+
path: /assets/img/bpi-r3-mini.jpg
11+
alt: Banana Pi BPi-R3 Mini Router
12+
show_in_post: false
913
---
1014

1115
Much thanks to the solid foundation curated by [Buildroot][1], Infix can

_posts/2024-10-15-basic-container.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ date: 2024-10-15 07:00:00 +0100
55
last_modified_at: 2026-02-27 12:00:00 +0100
66
categories: [showcase]
77
tags: [container, containers, networking, docker, podman]
8+
image:
9+
path: /assets/img/docker.webp
10+
alt: Docker whale
11+
show_in_post: false
812
---
913

1014
![Docker whale](/assets/img/docker.webp){: width="200" .right}

_posts/2025-10-27-banana-pi-r3.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ date: 2025-10-27 08:02:00 +0100
55
last_modified_at: 2026-02-27 10:00:00 +0100
66
categories: [showcase]
77
tags: [boards]
8+
image:
9+
path: /assets/img/bpi-r3-board.jpg
10+
alt: Banana Pi BPi-R3 router board
11+
show_in_post: false
812
---
913

1014
Infix now supports the [Banana Pi BPi-R3][1], an [affordable][7] (€130-€150),

_posts/2025-10-29-zone-based-firewall.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ author: troglobit
44
date: 2025-10-29 08:10:00 +0100
55
categories: [howto]
66
tags: [firewall, networking, security, zbf]
7+
image:
8+
path: /assets/img/fw-zones.svg
9+
alt: Traffic flow diagram showing zone-based firewall policies including a DMZ
10+
show_in_post: false
711
---
812

913
As of Infix v25.10, a zone-based firewall (ZBF) built on [firewalld][2]

0 commit comments

Comments
 (0)