I’m using sectionPagesMenu
in config.yaml
to automatically create menu entries for my top level sections. The navbar entry for the section is supposed to be highlighted (“active”) if the current page either is the section, or is a child of the section. However, it does not highlight when the current page is one of the top level sections.
I’m using the following code (similar to the Menu templates example ) for my navbar:
{{ range .Site.Menus.main }}
{{ $isActive := false }}
{{ if or ($.HasMenuCurrent .Menu .) ($.IsMenuCurrent .Menu .) }}
{{ $isActive = true }}
{{ end }}
<a class="navbar-item{{ if $isActive }} active{{ end }}"
{{ if strings.HasPrefix .URL "http" }}target="_blank" rel="noopener"{{ end }}
href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
Note how the Menu
field is empty in the generated MenuEntry according to debug.Dump
:
&navigation.MenuEntry{ // p1 MenuConfig: navigation.MenuConfig{ Identifier: "", Parent: "", Name: "Blog", Pre: "", Post: "", URL: "", PageRef: "", Weight: 0, Title: "Blog", Params: maps.Params(nil), // p2 }, Menu: "main", ConfiguredURL: "", Page: &hugolib.pageState{}, // p3 Children: nil, },
I’m thinking that the Menu
field being empty is the cause of my issue (since .IsMenuCurrent .Menu .
will never be true if .Menu
is nil). Is this a bug or is there an issue in my template code?
I think you can replace this:
{{ if or ($.HasMenuCurrent .Menu .) ($.IsMenuCurrent .Menu .) }}
With this:
{{ if or ($.HasMenuCurrent .Menu .) (.Page.Eq $) }}
It looks like the .IsMenuCurrent
method on Page
doesn’t like the automatic section menu.
I think you meant eq .Page $
instead of .Page.Eq $
, the former works!
(complete code)
<nav class="navbar" aria-label="{{ i18n "aria_navbar" }}">
{{ with .Site.Home }}
<a class="navbar-item{{ if $.IsHome }} active{{ end }}" href="{{ .Permalink | absLangURL }}">{{ .Title | markdownify }}</a>
{{ end }}
{{ range .Site.Menus.main }}
{{ $isActive := false }}
{{ if or ($.HasMenuCurrent .Menu .) (eq .Page $) }}
{{ $isActive = true }}
{{ end }}
<a class="navbar-item{{ if $isActive }} active{{ end }}"
{{ if strings.HasPrefix .URL "http" }}target="_blank" rel="noopener"{{ end }}
href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</nav>
Eq
is a Page
method to compare two pages.
Hmm, when I tried it that way I got an error:
render of "home" failed: e[1;36m"/home/bbaovanc/projects/bbaovanc.com/themes/bobatheme/layouts/_default/baseof.html:9:11"e[0m: execute of template failed at <partial "top.html" .>: error calling partial: e[1;36m"/home/bbaovanc/projects/bbaovanc.com/themes/bobatheme/layouts/partials/top.html:16:54"e[0m: execute of template failed at <.Page.Eq>: nil pointer evaluating navigation.Page.Eq render of "section" failed: nil pointer evaluating navigation.Page.Eq render: failed to render pages: render of "page" failed: nil pointer evaluating navigation.Page.Eq
Works for me…
git clone --single-branch -b hugo-forum-topic-46687 https://github.com/jmooring/hugo-testing hugo-forum-topic-46687
cd hugo-forum-topic-46687
hugo server
You have added an entry to the main menu in your site configuration that is not associated with a page:
menu:
main:
- identifier: status-page
name: Status
url: https://status.bbaovanc.com
And there’s nothing wrong with that.
But it explains why .Page.Eq
throws an error — you can’t call a method (.Eq
) on nil.
So stick with your equality check.
system
Closed
October 19, 2023, 1:55am
9
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.