Issue with .CurrentSection variable

support
1

I would like to display only the associated icon for the current section with the front matter as follows:

title: News
description: Lorem Ipsum
menu:
  main:
    Name: News
    Weight: 10
    Pre: <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-pen-tool"><path d="M12 19l7-7 3 3-7 7-3-3z"></path><path d="M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z"></path><path d="M2 2l7.586 7.586"></path><circle cx="11" cy="11" r="2"></circle></svg>

For the main menu the following code is successfully displaying the icon with {{ .Pre }} var aaible:

<div id="main-menu" class="animated fast">
    <ul>
        {{- range .Site.Menus.main }}
        <li><a href="{{ .URL | absLangURL }}">{{ .Pre }}</a></li>
        {{- end }}
    </ul>
</div>

But for the current section within an article the code as follows is displaying nothing:

<a id="nav-trigger" class="icon-btn" href="{{ .CurrentSection.RelPermalink }}"><span>{{ .CurrentSection.Params.Pre }}</span></a>

Any idea on what’s wrong with the variable or code syntax ? {{ .CurrentSection.Params.Pre }}

Thank you in advance

2

check it here

I use .Section to show the name
{{ with site.GetPage (printf "/%s" .Section) }}<a class=ph1 href={{ .RelPermalink }} >{{ .Name }}</a>{{ end}}

To find the current menu

{{ range site.Menus.main -}}
	{{ if $.Page.IsMenuCurrent "main" . -}}
	<span>{{.Name | markdownify}}</span>
	{{- end}}
{{- end}}
3

Thanks for showing the right direction and I move a step forward with the following code:

{{ range site.Menus.main -}}
	{{ if ( $.Page.IsMenuCurrent "main" .) ( $.Page.HasMenuCurrent "main" .) }}
    <a id="nav-trigger" class="icon-btn" href="{{ .URL }}"><span>{{ .Pre }}</span></a>
        {{ end }}
{{ end }}

It displays the icon of the current section when I am on the section list but not when I am on an article within the given section. I would like to use as a partial to display the current section icon for any post or section.

4

How about this?:

{{ range site.Menus.main -}}
	{{ if (or ( $.Page.IsMenuCurrent "main" .) ( $.Page.HasMenuCurrent "main" .)) }}
    <a id="nav-trigger" class="icon-btn" href="{{ .URL }}"><span>{{ .Pre }}</span></a>
        {{ end }}
{{ end }}
5

a long range of menues in every page will slow down the generation.
I use the following to show icons depending of the content type, same way for sections

{{-     if eq .Type   "post"     }}<i class="far fa-file-alt fa-fw"></i>
{{ else if eq .Layout "panorama" }}<span class="b mdi mdi-panorama-horizontal"></span>
{{ else if eq .Layout "gallery"  }}<i class="far fa-image fa-fw"></i>
{{ else if eq .Type   "photo"    }}<i class="far fa-image fa-fw"></i>
{{ else if eq .Type   "serie"    }}<i class="far fa-book  fa-fw"></i>
{{ else if eq .Type   "intern"   }}<i class="fas fa-lock  fa-fw red"></i>
{{ else if eq .Type   "links"    }}<i class="far fa-link  fa-fw"></i>
{{ else if eq .Type   "tags"     }}<i class="far fa-tag   fa-fw"></i>
{{ else                          }}<i class="far fa-sticky-note fa-fw"></i>{{end -}}

This uses symbols from https://www.home-assistant.io/ to complete the sample

PS: This is a partial “symbol.html”

6

It doesn’t work.
I tried to use the variable .InSection $anotherPage found in the docs but I don’t know how to deal with (as a newbie).

7

Not sure about this, but regarding your original attempted solution, maybe you were trying to access the .Pre tag of the parent menu item, which was outside of the current scope? Can you share the full code?

8

@pmm
Hi,
I made the repository public to allow access to the full code theme.
To be found here
Please note that the partial is topbar.html and I put it on top of single and list layouts.
Be indulgent since I am neither a coder nor a web pro.
The test site itself is build and deployed through Netlify and can be seen here

9

This seems to solve the issue:

<!-- topbar.html -->
<div id="topbar" role="banner">
    <a id="nav-trigger" class="icon-btn" href="{{.Site.BaseURL}}">{{ .Site.Title }}</a>
    {{ with .CurrentSection }}
    <a id="nav-trigger" class="icon-btn" href="{{ .RelPermalink }}">
    {{ with .Params.menu.main.Pre }}{{ . | safeHTML}}{{ end }}
    </a>
    {{ end }}
</div>

The .Pre param in your front matter is nested under menu.main, so you can’t access it with {{ .CurrentSection.Params.Pre }}.

Your original solution should work if you slightly modify it:

<a id="nav-trigger" class="icon-btn" href="{{ .CurrentSection.RelPermalink }}"><span>{{ .CurrentSection.Params.menu.main.Pre }}</span></a>
10

Thanks a lot.
It works !

11

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.