diff options
| author | Joel Pettersson <petterssonjoel@gmail.com> | 2022-08-14 23:12:35 +0300 |
|---|---|---|
| committer | Joel Pettersson <petterssonjoel@gmail.com> | 2022-08-14 23:12:35 +0300 |
| commit | 17179c683a3eda6a1c89fcb5de4614a85c28e463 (patch) | |
| tree | 3bb1406a70cdc0bfe4deba99bd618002d7af1d5f | |
| parent | 41ee32b40dd9ec193b3f9230cc05dee36580a91b (diff) | |
Fix home page not marked as active in menu
Previously, with a menu item as follows, the "Home" link did not get
the `active` CSS class and was thus not styled as such.
```toml
[[menu.main]]
name = "Home"
url = "/"
weight = 1
```
The approach used here to determine whether the current page
corresponds to a certain menu entry was inspired by the one suggested
at https://stackoverflow.com/a/56454338. It is supposedly also more
robust when dealing with multilingual sites.
| -rw-r--r-- | layouts/partials/footer-menu.html | 2 | ||||
| -rw-r--r-- | layouts/partials/main-menu-mobile.html | 4 | ||||
| -rw-r--r-- | layouts/partials/main-menu.html | 2 |
3 files changed, 5 insertions, 3 deletions
diff --git a/layouts/partials/footer-menu.html b/layouts/partials/footer-menu.html index 6ec4094..b2a2817 100644 --- a/layouts/partials/footer-menu.html +++ b/layouts/partials/footer-menu.html @@ -3,7 +3,7 @@ {{ $currentPage := . }} {{ range .Site.Menus.footer }} {{ $active := or ($currentPage.IsMenuCurrent "footer" .) ($currentPage.HasMenuCurrent "footer" .) }} - {{ $active = or $active (eq .Name $currentPage.Title) }} + {{ $active = or $active (eq (.URL | relLangURL) ($currentPage.RelPermalink | relLangURL)) }} <li class="menu-item-{{ .Name | lower }} {{ if $active }}active{{ end }}"> <a href="{{.URL}}"> {{ .Pre }} diff --git a/layouts/partials/main-menu-mobile.html b/layouts/partials/main-menu-mobile.html index 5211ea7..23f3ff5 100644 --- a/layouts/partials/main-menu-mobile.html +++ b/layouts/partials/main-menu-mobile.html @@ -2,7 +2,9 @@ <ul> {{ $currentPage := . }} {{ range .Site.Menus.main }} - <li class="menu-item-{{ .Name | lower }}{{ if $currentPage.IsMenuCurrent "main" . }} active{{ end }}"> + {{ $active := or ($currentPage.IsMenuCurrent "footer" .) ($currentPage.HasMenuCurrent "footer" .) }} + {{ $active = or $active (eq (.URL | relLangURL) ($currentPage.RelPermalink | relLangURL)) }} + <li class="menu-item-{{ .Name | lower }} {{ if $active }}active{{ end }}"> <a href="{{ .URL }}"> <span>{{ .Name }}</span> </a> diff --git a/layouts/partials/main-menu.html b/layouts/partials/main-menu.html index 00a7dc0..3951cf7 100644 --- a/layouts/partials/main-menu.html +++ b/layouts/partials/main-menu.html @@ -3,7 +3,7 @@ {{ $currentPage := . }} {{ range .Site.Menus.main }} {{ $active := or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }} - {{ $active = or $active (eq .Name $currentPage.Title) }} + {{ $active = or $active (eq (.URL | relLangURL) ($currentPage.RelPermalink | relLangURL)) }} <li class="menu-item-{{ .Name | lower }} {{ if $active }}active{{ end }}"> <a href="{{.URL}}"> {{ .Pre }} |