Salient v13.0 Major Release (3/25/2021) is now available.

If you're on a version prior to 10.5 and are considering updating, it's important to read through our update guide before updating to ensure a smooth transition.

Click here to view the update guide

Okay
  Public Ticket #2687379
Chance menu font colour on 1 specific page
Closed

Comments

  • riponad2 started the conversation

    hello


    I need to change the menu colour to black on 1 specific page (contact page)


    Any CSS script that can help achieve that?


    Thanks


  •  1,652
    Andrew replied

    Hi there,

    Use the following custom css:

    body.page-id-5288 #header-outer[data-transparent-header="true"].transparent nav >ul >li >a {
        color: black;
    }
    

    Kind regards.

  • riponad2 replied

    Hi Andrew


    Sharing a screenshot of the inline CSS

    I tried.

    .body.page-id-5288 #header-outer[data-transparent-header="true"].transparent nav >ul >li >a {
        color: black;
    }
    

    But didn't change the text colour, maybe it conflicting with another CSS setting?

    Otherwise i can give you access to the page

    Thanks

    Attached files:  Screenshot 2021-02-11 at 09.52.14.png

  •  1,652
    Andrew replied

    Hi there,

    There seems to be a dot at the beginning of body in css you shared.

    Try the following:

    body.page-id-5288 #header-outer nav >ul >li >a {
        color: black !important;
    }
    

    Here is how it looks

    2870398734.png


    Kind regards.

  • riponad2 replied

    Hi Andrew, thank you

    I should have mentioned, its actually the other 'main menu' where I need the font text black - apologies. 

    While your CSS does indeed work for the secondary menu. But hat will come in useful in the future anyways.

    body.page-id-5288 #header-outer nav >ul >li >a {
        color: black !important;
    }
    

    Do you know if there is a CSS workaround for changing the font colour in the main navigation menu in a specific page?

    Thanks again

    Adam

    Attached files:  Screenshot 2021-02-11 at 20.31.40.png

  •  1,652
    Andrew replied

    Hi Adam,

    The following css will change the color to white on main navigation menu. The page ID 5288 will apply to this specific page only https://www.surfstr.com/contact/

    body.page-id-5288 #header-outer.transparent.dark-slide > #top nav > ul > li > a {
        color: black !important;
    }
    

    Hope this helps.

  • riponad2 replied

    Many thanks Andrew - worked like a charm :)