blog/themes/chosto/layouts/partials/navbar.html

<nav class="navbar is-fixed-top is-transparent" role="navigation" aria-label="main navigation">
  <div class="navbar-brand">
    <a class="navbar-item" href="{{ .Site.Home.Permalink }}">
      <img src="https://bulma.io/images/placeholders/128x128.png">
    </a>
    <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbar">
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
    </a>

    <div id="navbar" class="navbar-menu">
      <div class="navbar-start">
        <a class="navbar-item {{ if eq .Permalink .Site.Home.Permalink }}is-active is-tab{{ end }}" href="{{ .Site.Home.Permalink }}">Accueil</a>
        <div class="navbar-item has-dropdown is-hoverable">
          <a class="navbar-link">
            Catégories
          </a>
          <div class="navbar-dropdown">
            {{ range $key, $value := .Site.Taxonomies.categories }}
            <a class="navbar-item" href="{{ .Page.Permalink }}">
              {{ $key | humanize }}
              <span class="tag ml-2 is-rounded">{{ len . }}</span>
            </a>
            {{ end }}
          </div>
        </div>
        {{ $currentPage := . }}
        {{ range .Site.Menus.main }}
        {{ if .HasChildren }}
        <div class="navbar-item has-dropdown is-hoverable {{ if $currentPage.HasMenuCurrent "main" . }}is-active is-tab{{ end }}">
          <a class="navbar-link">
            {{ .Pre }}
            <span>{{ .Name }}</span>
          </a>
          <div class="navbar-dropdown">
            {{ range .Children }}
            <a class="navbar-item {{ if $currentPage.IsMenuCurrent "main" . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
            {{ end }}
          </div>
        </div>
        {{ else }}
        <a class="navbar-item {{ if $currentPage.IsMenuCurrent "main" . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
        {{ end }}
        {{ end }}
      </div>
      <div class="navbar-end">
        <!-- See later to differentiate -->
      </div>
    </div>
  </div>
</nav>