Menu can't be triggered when the text is Chinese

support
1

As post title, here is the issue.
My config.toml like this:

[[languages.zh.menu.docs]]
  name = "关于 Jenkins X"
  weight = 1
  identifier = "about"
  url = "/zh/about/"

Then menu html code like this:

<li class="f5 w-100 hover-bg-light-gray hover-accent-color-light fw8">
        <a href="javascript:void(0)" class="js-toggle dib w-100 link mid-gray hover-accent-color-light pl2 pr2 pv2 " data-target=".%E5%85%B3%E4%BA%8E-jenkins-x">关于 Jenkins X</a>

          
            <ul class="%E5%85%B3%E4%BA%8E-jenkins-x desktopmenu animated fadeIn list pl0 bg-light-gray dn">
              
                <li class="f6 fw4">
                  <a href="http://localhost:1313/zh/about/" class="db link hover-bg-gray hover-white pl3 pr2 pv2 black ">
                    概览
                  </a>
                </li>
              
                <li class="f6 fw4">
                  <a href="http://localhost:1313/zh/about/features/" class="db link hover-bg-gray hover-white pl3 pr2 pv2 black ">
                    Features
                  </a>
                </li>
              
                <li class="f6 fw4">
                  <a href="http://localhost:1313/zh/about/concepts/" class="db link hover-bg-gray hover-white pl3 pr2 pv2 black ">
                    Concepts
                  </a>
                </li>
              
                <li class="f6 fw4">
                  <a href="http://localhost:1313/zh/about/license/" class="db link hover-bg-gray hover-white pl3 pr2 pv2 black ">
                    License
                  </a>
                </li>
              
            </ul>
          
        </li>

In this case, it can’t be triggered the menu item according to the data-target, because it has been encoded.
Maybe Hugo can add a custom data-target attribute for menu config.

Mac OS X 10.10.4 (14E46)
Hugo Static Site Generator v0.39-DEV-2AAB6DE darwin/amd64 BuildDate: 2018-04-13T20:49:19+0800

2

Hi @LinuxSuRen,

If I recall correctly, there is a Hugo function that prevent stuff from being encoded, maybe something like safeHTMLAttr? Or something else altogether. My first hunch.

Note that this would have affected other languages which uses non-ASCII characters too, so I’m sure Hugo already has a way to deal with non-ASCII characters in menu entries, hence likely not a bug. (Otherwise, other users would have complained a log time ago already, haha.)

3

It should be that. But don’t know how to use that function.

4

Show us your template code please, @LinuxSuRen?

When you call the menu name, it would be something like {{ .Name | safeHTML }}, pipes to the function you need. I have not experimented with this so, safeHTML might not work to not encode.

You might consider setting and calling .Pre and/or .Post, setting those to English.

[[languages.zh.menu.docs]]
  name = "关于 Jenkins X"
  weight = 1
  identifier = "about"
  url = "/zh/about/"
  pre = "something-jenkins-x"
5

Thanks a lot, I don’t know how to use template before. I already figure it out now, under your hit.

1 Like
6

A follow-up: From https://github.com/gohugoio/hugo/issues/4654, it turns out that @LinuxSuRen was seeing this with gohugoioTheme, and solved the issue by changing

{{ .Name | urlize }}

to

{{ .Name | safeHTML }}

as seen his Pull Request https://github.com/gohugoio/gohugoioTheme/pull/88.