Mixing html with frontmatter

support
1

Have searched to no avail —

Is there a trick to mixing html with frontmatter? i.e., to have a subhede / title / desc in your YAML that contains a link?

i.e.,:

---
subhede: 'A descriptive secondary header text <a href="https://something.com">with a link</a>' 
---

This outputs the string but the browser doesn’t render the html as html …

i.e.,

<h2>{{ subhede }}</h2>

Outputs, as an h2 in the browser:

A descriptive secondary header text <a href="https://something.com">with a link</a>

Where the link isn’t a link, just the string, verboten.

Cheers.

2

I think what you want is to pipe it through safeHTML

So

<h2>{{ subhede | safeHTML }}</h2>
2 Likes
3

AH! Thank you. That’s what I was looking for.

C

4

A better solution for links in the frontmatter: use markdown!

And then the markdownify filter: https://gohugo.io/functions/markdownify/

<h2>{{ subhede | markdownify }}</h2>
1 Like
5

Possibly better. If one person is writing, they can get away with that. But I have projects where we use a variety of HTML in front matter that won’t be markdownified. So make sure to keep it consistent! :slight_smile:

1 Like