Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • #1146648

    Dear Enfold team,

    I’ve tried the advanced styling and some of the codes you provided in this forum but nothing seems to work for me..

    I would simply like to change the colour of my active menu item to a certain colour, and have the same highlight colour when hovering.

    How can I achieve this?

    Thanks for your awesome support!


    Hey Carolin,

    I’m currently seeing the active color as :#387485. Is this not correct?

    Best regards,
    Jordan Shannon


    Hi Jordan,
    I was playing around but didn’t manage to solve the problem.
    I currently see the active and inactive menu items white (#ffffff) and light grey on hover.
    On the NEWS page, the behaviour seems to be different and the active menu item is #387485??
    I’m really going crazy over this problem…
    Maybe it has something to do with the transparent header and behaviour “shrinking when scrolling”??
    Thanks for your help..



    Yes the transparent header has the white hover and highlight styling. So you want it to have #387485 at all times then?

    Best regards,
    Jordan Shannon


    I would like to have white font for inactive menu links and the #387485 colour with bold font on hover and active menu item.

    Thanks for your patience Jordan!



    Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:

    #avia-menu .current-menu-item .avia-menu-text, #avia-menu .avia-menu-text:hover {

    Best regards,


    Ciao Rikard,

    it looks much better now, thank you! The only thing to resolve is not the color of the font in the submenu on “Projekte”. If I click on the main menu “Projekte” and it becomes active, all the submenu items are active (blue color of the font), too, although only the main menu item should be?
    If I select one of the projects, are the other ones in the submenu remain active, too??

    The sub menu items are portfolio items – is that the problem?

    Thanks again



    Thank you for sharing the details.

    Please replace the above code with the code from the below link

    You may not see the changes until the cached files are cleared in your browser.

    Please perform the below steps to clear the browser cache:

    1. Disable “merging and compression” for CSS and JS files from Enfold > Performance.
    2. If a caching plugin is installed check the plugin settings and clear the cache and deactivate the plugins for testing purpose.
    3. Hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right-click on the refresh button and select “Empty Cache and Hard Reload”.

    Best regards,

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.