How can I place HTML tags in a Jekyll post’s (YAML-encoded) front matter and stop this HTML from being escaped in the final output? My content, including titles of posts, uses multiple languages in addition to the main page language and this requires proper markup with span lang="XX"
tags for screen readers and certain automated extraction. However, attempting to write the following:
---
layout: post
title: A post that says <span lang="fr">Bonjour</span> and <span lang="es">Hola</span>
---
results in HTML output where these tags have been escaped:
<h1 class="post-title p-name" itemprop="name headline">A post that says <span lang="fr">Bonjour</span> and <span lang="es">Hola</span></h1>
I am using Jekyll minima theme.
So, on the minima theme of Jekyll, that you are using, there is an escape
filter that is applied per design on the page.title
.
From the documentation:
Escapes a string by replacing characters with escape sequences (so that the string can be used in a URL, for example). It doesn’t change strings that don’t have anything to escape.
Source: https://shopify.github.io/liquid/filters/escape/
If you want your span
to display, you should edit the file _layouts/post.html and remove this espace
filter.
Your line 7 of this file should look like
<h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1>
Source: https://github.com/jekyll/minima/blob/49f6dce0727a2441f0b0c265b41b5efc7b042eb6/_layouts/post.html#L7
Change it so it reads
<h1 class="post-title p-name" itemprop="name headline">{{ page.title }}</h1>
And you will have your expected behaviour.