Custom rendering of header tag

support
1

Hi everyone,

I’m writing a custom theme that I’m planning to use with a css framework (http://bulma.io/). This framework expects header elements to have certain classes. For example:

<h2 class="title is-2">Title 2</h2>

However, Hugo/Blackfriday renders headers like this:

Markdown input

## Title 2

HTML Output

<h2 id="title-2">Title 2</h2>

Is there a way to customise how header elements (from Markdown) are rendered? A simple template for each element type would be ideal, but I can also write some go code if someone can point me in the right direction.

Thanks!
Aslak

1 Like
2

Take a look on this post

3

Perfect thanks!!

4

I just use an empty shortcode inside a mardown file for this type of thing. No need to hack Hugo’s markdown engine.

For example

{{< wrap >}}<h2 class="whatever">Blah-blah</h2>{{</ wrap >}}

And my wrap.html shortcode is simply this:

{{ .Inner }}

EDIT
Or just type the <h2 class="blah">Blah Blah</h2> element straight. I just found out that Blackfriday accepts this.