Non-breaking dash in menu?

support
1

How do I put a non-breaking dash in a menu?

I have a menus.toml and if I try to use Sample‑Item it shows up as Sample‑Item instead of Sample-Item in the menu.
With a “-” it looks like this:

Sample-
Item

2

Your menu is probably too small by default to have both words displayed on one line and every browser understands a simple dash as “word break” symbol. Try a “non breaking dash”

3

I did. But the html entity shows up in the menu. That’s my question :slight_smile:

4

Check the layout file that creates the menu. There might be markdownify or htmlescape in play. If you can copy paste the non-breakable-dash into the menu-config try that first. If that does not work please post the layout for the navigation.

5

To render this:

[[main]]
identifier = "html-entity"
name = "html&#8209entity"
url = "/html-entity/"
weight = 1

You need to do this:

{{ range .Site.Menus.main }}
  <a href="{{ .URL }}">{{ .Name | htmlUnescape }}</a>
{{ end }}

See https://gohugo.io/functions/htmlunescape/.

5 Likes
6

thanks for the awesome information.