hugo-coder/layouts/partials/header.html

<nav class="navigation">
  <section class="container">
    <a class="navigation-title" href="{{ .Site.BaseURL | absLangURL }}">
      {{ .Site.Title }}
    </a>
    <input type="checkbox" id="menu-toggle" />
    <label class="menu-button float-right" for="menu-toggle"><i class="fas fa-bars"></i></label>
    <ul class="navigation-list">
      {{ with .Site.Menus.main}}
        {{ range sort . }}
          <li class="navigation-item">
            <a class="navigation-link" href="{{ .URL | absLangURL }}">{{ .Name }}</a>
          </li>
        {{ end }}
      {{ end }}
      {{ if .Site.IsMultiLingual }}
        {{ $node := . }}
        {{ .Scratch.Set "separator" true }}
        {{ range .Site.Home.AllTranslations }}
          {{ if ne $.Site.Language .Language }}
            {{ if $node.Scratch.Get "separator" }}
              <li class="navigation-item menu-separator">
                <span>|</span>
              </li>
              {{ $node.Scratch.Set "separator" false }}
            {{ end }}
            <li class="navigation-item">
              <a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
            </li>
          {{ end }}
        {{ end }}
      {{ end }}
    </ul>
  </section>
</nav>