Using if equal from the [menu] config.toml value

support
1

Hi there,

Unable to understand why this doesn’t work also try the {{with what I am doing wrong?

my config.toml

[menu]
  [[menu.main]]
    identifier = "home"
    name = "Home"
    url = "/"
    weight = 1
  [[menu.main]]
    identifier = "about"
    name = "About us"
    url = "/about"
    weight = 2
  [[menu.main]]
    identifier = "category1"
    name = "plastic"
    url = "/plastic"
    parent = "about"
    pre = "Some text here .. "
    iconClass = "duck"
    weight = 1

trying to use this in layouts which is under the range menu and range children I can use the {{.name}} and {{.Pre}} but why cant it

 {{ if eq .iconClass "duck" }}
some custom duck text and svg in this section
{{ else if  eq .iconClass "soldier"}}
some custom toy soldier text and svg in this section
{{end}}

the error I receive is unterminated quoted string

I find similar post in the form but with solution maybe some one can provide there feedback on this thanks.

2

You cannot add custom keys to the root of a menu entry.

Do this instead:

[menu]
  [[menu.main]]
    name = "About"
    pageref = "/about"
    weight = 1
    [menu.main.params]
    iconClass = "duck"

And access it like this:

{{ range site.Menus.main }}
  {{ .Params.iconClass }}
{{ end }}

See https://gohugo.io/content-management/menus/#params

Also, when defining menu entries in site configuration, use pageref instead of url for internal pages.

3

Hi @jmooring

thanks for sharing the trick to use pageref:

I am trying to use svg path which I cannot add in the config.toml

so I am trying to use short-code in layouts like this

{{ if eq .iconClass "thumbsup" }}
<path d="M2 10.5a1.5 1.5 0 113 0v6a1.5 1.5 0 01-3 0v-6zM6 10.333v5.43a2 2 0 001.106 1.79l.05.025A4 4 0 008.943 18h5.416a2 2 0 001.962-1.608l1.2-6A2 2 0 0015.56 8H12V4a2 2 0 00-2-2 1 1 0 00-1 1v.667a4 4 0 01-.8 2.4L6.8 7.933a4 4 0 00-.8 2.4z" />
{{ else if  eq .iconClass "thumbsdown"}}
<path d="M18 9.5a1.5 1.5 0 11-3 0v-6a1.5 1.5 0 013 0v6zM14 9.667v-5.43a2 2 0 00-1.105-1.79l-.05-.025A4 4 0 0011.055 2H5.64a2 2 0 00-1.962 1.608l-1.2 6A2 2 0 004.44 12H8v4a2 2 0 002 2 1 1 0 001-1v-.667a4 4 0 01.8-2.4l1.4-1.866a4 4 0 00.8-2.4z" />
{{end}}

like this what other method I can use. as the {{ .Params.iconClass }} works fine for simple text etc.

thanks for taking the time

4 
{{ range site.Menus.main }}
  {{ if eq .Params.iconClass "thumbsup" }}
    <svg xmlns="http://www.w3.org/2000/svg">
      <path d="M2 10.5a1.5 1.5 0 113 0v6a1.5 1.5 0 01-3 0v-6zM6 10.333v5.43a2 2 0 001.106 1.79l.05.025A4 4 0 008.943 18h5.416a2 2 0 001.962-1.608l1.2-6A2 2 0 0015.56 8H12V4a2 2 0 00-2-2 1 1 0 00-1 1v.667a4 4 0 01-.8 2.4L6.8 7.933a4 4 0 00-.8 2.4z" />
    </svg>
  {{ else if eq .Params.iconClass "thumbsdown" }}
    <svg xmlns="http://www.w3.org/2000/svg">
      <path d="M18 9.5a1.5 1.5 0 11-3 0v-6a1.5 1.5 0 013 0v6zM14 9.667v-5.43a2 2 0 00-1.105-1.79l-.05-.025A4 4 0 0011.055 2H5.64a2 2 0 00-1.962 1.608l-1.2 6A2 2 0 004.44 12H8v4a2 2 0 002 2 1 1 0 001-1v-.667a4 4 0 01.8-2.4l1.4-1.866a4 4 0 00.8-2.4z" />
    </svg>
  {{end }}
{{ end }}

For further assistance with the svg element see:
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/svg