Can the built-in menu template be customized or is it intended to remain unchanged?

[zoliky]

Hello,
When I create a new Hugo theme, I see a partial called menu.html that has some HTML and Go template code in it. This partial comes with Hugo and it’s a fairly long file, but the key part that shows the markup is this:

{{- with index site.Menus $menuID }}
  <nav>
    <ul>
      {{- partial "inline/menu/walk.html" (dict "page" $page "menuEntries" .) }}
    </ul>
  </nav>
{{- end }}

This partial is called with:

// Renders a menu for the given menu ID.
// @context {page} page The current page.
// @context {string} menuID The menu ID.
// @example: {{ partial "menu.html" (dict "menuID" "main" "page" .) }}

{{ partial "menu.html" (dict "menuID" "main" "page" .) }}

To create a hamburger-style navigation, I need the markup to include a few more <div> elements, like this:

<nav class="nav">

  <div class="menu-toggle">
    <div class="hamburger"></div>
  </div>

  <div class="menu-dropdown">
    <ul class="nav-menu">
      <li><a href="/">Home</a></li>
      <li><a href="/about">About</a></li>
      <li><a href="/posts">Posts</a></li>
    </ul>
  </div>

</nav>

However, this would mean modifying the markup of the menu.html partial, while keeping the current Go template logic unchanged.

Since the partial is called with some arguments {{ partial "menu.html" (dict "menuID" "main" "page" .) }} I’m wondering if it’s a good idea to modify the menu.html file at all.

[jmooring]

You can modify the menu.html file as needed.

[zoliky]

Thank you. I had the impression that it’s some sort of base template which, when called with the arguments, is used just to create standard menus. But you’re right, I think it’s always possible to create copies like menu2.html if there’s a need for a different type of menu on the page, besides the main one.

[jmooring]

Your understanding is correct.