CODEWITHSUNDEEP
markdownblogshugo
Chris
Chris

Reputation: 121

How do I add a <span> or <br> to a title in Hugo?

---
title: This is a really long heading
section: '/'
date: 2019-08-10T18:58:32+01:00
draft: true
---

How do I add a break before "long" or add a <span> element to the markdown title in Hugo for e.g. <span>long heading</span> or This is a really <br>long heading

Upvotes: 2

Views: 993

Answers (1)

Chris
Chris

Reputation: 136936

If you include a <br> in your title, e.g.

---
title: This is a really<br>long heading
---

you must mark the value as safe in your template, e.g.

{{- .Title | safeHTML -}}

Note that this does expose you to potential security risks:

It should not be used for HTML from a third-party, or HTML with unclosed tags or comments.

Make sure you only do this with well-formed content you trust.

You'll have to make this change everywhere your title is shown in your theme. If there are places where you don't want the title to break, e.g. in your list.html, you can strip the HTML out with plainify instead:

{{- .Title | plainify -}}

This prevents <br> from being shown literally.

Upvotes: 2

Related Questions