Link optionals

support
1

so I am trying to like the optional in my single.html

{{ partial “nav” (dict “current_page” “on_page”) }}

and trying to link to some code in my partial here

  • Home

    • the CSS is internal in the partial for the id on page made like this

    .on_page { background-color: green; color:white; }

    how do I properly refer to the page so the internal CSS can be activatted

    2

    It isn’t clear from what you write what you try to do.

    3

    here is my index.html and my partial
    index.html

    {{ partial “head” . }}

    {{ partial “main_title” . }}

    {{ partial “nav” (dict “home” “on_page”) }}

    nav.html

    .on_page { background-color: green; color:white; } 
    <div class="container" >




      <ul class="pagination " style =" margin-left:200px" >
        <li><a href="#" style ="color:green" >Home</a></li>
        <li><a href="#" style ="color:green">The Team</a></li>
        <li><a href="#" style ="color:green">Products & Programs</a></li>
        <li><a href="#" style ="color:green">The Loan Process</a></li>
        <li><a href="#" style ="color:green">Pre-Approval Application</a></li>
        <li><a href="#" style ="color:green">Contact</a></li>
      </ul>
</div>
    4

    ignore that here is what im trying to do
    website : http://169.226.142.230:3001/
    file:nav.html

    .on_page { background-color: green; color:white; } 
    <div class="container" >




      <ul class="pagination " style =" margin-left:200px" >
        <li><a href="#" style ="color:green" id = "{{.home}}">Home</a></li>
        <li><a href="#" style ="color:green">The Team</a></li>
        <li><a href="#" style ="color:green">Products & Programs</a></li>
        <li><a href="#" style ="color:green">The Loan Process</a></li>
        <li><a href="#" style ="color:green">Pre-Approval Application</a></li>
        <li><a href="#" style ="color:green">Contact</a></li>
      </ul>
</div>

    file:index.html

    {{ partial “head” . }}

    {{ partial “main_title” . }}

    {{ partial “nav” (dict “home” “on_page”) }}

    now I need the optional [home] to insert the CSS id on_page into the nav, concerning index HTML so the pagination will receive the effects off the CSS id

    5

    I’m totally lost. :confused:

    Can you explain more clearly? And also, it’s really hard to read your replies. Try to format them correctly.

    1 Like
    6

    how should I format them

    7

    alright let me try to explain the question in parts

    first

    what is the syntax for this piece of data

    {{.variable}}

    8

    Check the last few examples here: https://gohugo.io/extras/menus/

    I think what you want is to show the current menu item highlighted, so add a conditional class like “is-active”.

    9

    I cant add a custom class in order to show the “is-active” property