Commonmark 'MARK' element (aka `==`) and Gold Mark rendering

[DarwinJS]

I searched the existing posts and could not find a hit on this topic.

I would like to use <MARK>Some highlighted text</MARK> in a hugo site (or the markdown equivalent ==Highlighted Text==)

With the goldmark rendering in Hugo neither of these produce highlighting.

I went to Sign in to GitHub · GitHub which strongly asserts that they are common mark compliant. When I try the above in commonmark.js demo it renders reverse text.

I also found this entire fork of goldmark that seems to just handle this one code: GitHub - zuern/goldmark-highlight

Does anyone know what the issue is here?

[kaushalmodi]

@DarwinJS

I would like to use <MARK> Some highlighted text </MARK> in a hugo site

You need to add this to your site config:

[markup.goldmark.renderer]
  unsafe = true

And then <mark>Some highlighted text</mark> will work (I use that in almost all my posts on my Hugo site).

---

@bep Is there any chance to still make this a default?

[kaushalmodi]

@DarwinJS

(or the markdown equivalent ==Highlighted Text==)

I am not sure if that’s a supported syntax; at least it doesn’t work in commonmark.js demo.

[davidsneighbour]

@kaushalmodi

I am not sure if that’s a supported syntax; at least it doesn’t work in commonmark.js demo.

It’s not part of Markdown or CommonMark. I would attempt this with a shortcode instead.

[DarwinJS]

I author in Typora and if it was compliant I would see the highlighting live. It also makes the non-hugo rendering less and less human readable in other contexts.

However, the goldmark demo does render the <mark> tag - is that goldmark doing that rendering?

Can I just style the HTML element <mark> in my hugo theme?

FYI the MARK tag does not show up in rendered markdown when the element is not recognized.

Can I create a shortcode with the standard code so I get both renderings - like this?
{{<MARK>}}Testing in Production Like environments to find missing configuration information{{</MARK>}}

[kaushalmodi]

@DarwinJS

However, the goldmark demo does render the <mark> tag - is that goldmark doing that rendering?

No, that’s just HTML.

@DarwinJS

Can I just style the HTML element <mark> in my hugo theme?

Sure. Try it out.

@DarwinJS

FYI the MARK tag does not show up in rendered markdown when the element is not recognized.

Did you see this comment? (btw you don’t need to capitalize the HTML tags. Lowercase <mark> .. </mark> works just fine.

@DarwinJS

Can I create a shortcode with the standard code so I get both renderings - like this?

Yes. See the documentation for custom shortcodes.

[DarwinJS]

Opps, just needed

In hugo config.toml

[markup]
  [markup.goldmark]
    [markup.goldmark.renderer]
      unsafe = true

[kaushalmodi]

¯\_(ツ)_/¯

Commonmark 'MARK' element (aka `==`) and Gold Mark rendering

You need to add this to your site config: [markup.goldmark.renderer] unsafe = true And then <mark>Some highlighted text</mark> will work (I use that in almost all my posts on my Hugo site). @bep Is there any chance to still make this a default?

[DarwinJS]

I also added nicer colors in a css override

/* Highligh colors for mark element and spans */
mark, .hlyellow {
    background-color: rgb(2255, 247, 175);
}

.hlpink {
    background-color: rgb(255,191,206);
}

.hlblue {
    background-color: rgb(178,205,251);
}

.hlorange {
    background-color: rgb(255,215,174);
}