Rename Docs menu

[orientalpers]

How i can rename Docs menu item? If i change name param in menus.{lang}.toml file, then menu item does not marked as active item when i browse docs

[h-enk]

Make sure to have your identifiers set right — see also https://getdoks.org/docs/how-to/pages-and-menus/menus/#add-to-docs-menu

[bora-7]

This link doesn't work anymore. I can't find any documentation on changing/adding menu items.

[h-enk]

See Navigation

[orientalpers]

I try this:

[[main]]
  name = "Документация"
  identifier = "docs"
  url = "/docs/catalog/currencies/"
  weight = 10

But it doesn't work

[orientalpers]

I find solution.
name parameter of menu should match the directory name

This config doesn't work with path content/en/docs/catalog/currencies.md

[[main]]
  name = "Documentation"
  url = "/docs/catalog/currencies/"

And this works with path content/en/documentation/catalog/currencies.md

[[main]]
  name = "Documentation"
  url = "/documentation/catalog/currencies/"

So in multilingual site, filesystem paths and urls must be localized.

[orientalpers]

How can i change only rendered menu item text without change url and directory names

[roheclassic]

My understanding is that name parameter of menu can be set independently and does not need to match the directory name.
What's happening in your environment seems to have another cause.

Other possible causes include identifier mentioned above and non-compliance with the file structure (Content Organization) specified by Hugo.

[orientalpers]

I made a test repo https://github.com/orientalpers/doks-test
I add identifier = "docs" to Documentation menu, but it is still doesn't marked as active menu when i browse content inside docs folder.
What is wrong?

[roheclassic]

I've checked on your sample project.
Indeed, your opinion seems correct.

(I misunderstood the meaning of your request in this question from the beginning.
I was thinking that your problems are things about navigation in the doc menu. 😅)

So, Let me share what I found.
Probably, the conditions are as follows :

1. name in menu.toml and current section (directory path) match. (This is the same as yours.)
2. name matches the title of the content.
3. name matches Blog and the current section is either blog or contributors.

*You can find the implementation of this in layout/header.html.

In any case, whether navi-link of main menu will be active or not is determined by comparison with its own name.
As you said, practically, it doesn't work in a multilingual environment.

I haven't come up with a workaround yet.

memo (an idea):
get .URL of Site.Menus.main and if it's fully contained in the current section,to activate the menu.

[roheclassic]

I tried to define my own navi-link activation rule.
It doesn't use name in menu.toml, so you can set the menu display name for each language.

activate conditions:

• Top level menu

1. identifier in menu.toml matches the current section.
2. url in menu.toml matches the url (directory path) of the current page.
3. identifier in menu.toml matches blog and the url of the current page matches contributors .

• children

1. url in menu.toml matches the url (directory path) of the current page.

excerpt

<ul class="nav flex-column flex-md-row ms-md-n3">
  {{- $current := . -}}
  {{- $section := $current.Section -}}
  {{ range .Site.Menus.main -}}
    {{ $url := print .URL  "/" }}
    {{ $url := $url | safeURL | urlize | relURL }}
    {{- $active := or ($current.IsMenuCurrent "main" .) ($current.HasMenuCurrent "main" .) -}}
    {{- $active = or $active (and (eq .Identifier $current.Section) (ne .Identifier "") (ne $current.Section "")) -}}
    {{- $active = or $active (and (eq .Identifier "blog") (eq $current.Section "contributors")) -}}
    {{- $active = or $active (eq $url $current.RelPermalink) -}}
    {{ if .HasChildren }}
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle ps-0 py-1{{ if $active }} active{{ end }}" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false">
          {{ .Name }}
          <span class="dropdown-caret"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg></span>
        </a>
        <ul class="dropdown-menu dropdown-menu-main shadow rounded border-0" aria-labelledby="navbarDropdownMenuLink">
          {{ range .Children -}}
            {{$url := print .URL  "/" }}
            {{$url := $url | safeURL | urlize | relURL }}
            {{- $active := or ($current.IsMenuCurrent "main" .) ($current.HasMenuCurrent "main" .) -}}
            {{- $active = eq $url $current.RelPermalink -}}
            <li>
              <a class="dropdown-item{{ if $active }} active{{ end }}" href="{{ .URL | relLangURL }}"{{ if $active }} aria-current="true"{{ end }}>{{ .Name }}</a>
            </li>
          {{ end -}}
        </ul>
      </li>
    {{ else }}
      <li class="nav-item">
        <a class="nav-link ps-0 py-1{{ if $active }} active{{ end }}" href="{{ .URL | relLangURL }}">{{ .Name }}</a>
      </li>
    {{ end }}
  {{ end -}}
</ul>

(And I made changes so that the top level menu and the child are highlighted independently while I'm at it.)

I sent PR to your repository.

Is this close to the behavior you want?
You should check it out.😄

[h-enk]

Thanks! I'll have a closer look later.