Okay
  Public Ticket #3985998
Salinet menu items other behavior between menu's
Closed

Comments

  •  5
    Filip started the conversation
    3 weeks ago on May 9, 2025 at 12:45pm

    Hello,

    I've also built our own site using Salient. One thing I’m struggling with — and I can’t figure out where this behavior is coming from — is the Salient mega menu settings.

    On my main page, https://www.computerfabriek.be/, the buttons for Webshop and Support look fine, and the site splits into two sections: Consumer and B2B:

    https://www.computerfabriek.be/particulieren/

    https://www.computerfabriek.be/bedrijven/

    I’m using the Conditional Menu plugin from Themify to show two different menus on those pages. However, when I apply the same settings in that menu as on the main page menu, I don’t get the same button/background appearance — even though the settings are identical.

    Can you help me figure out what might be causing this?

    Thanks
    Filip


  •  9,254
    Tahir replied
    3 weeks ago on May 9, 2025 at 1:34pm

    Hey Again,

    Thanks for reaching out! .

    I am not seeing any buttons in the Main Menu, Please confirm if the settings are active ?.

    Best,

     

    ThemeNectar Support Team 

  •  5
    Filip replied
    3 weeks ago on May 9, 2025 at 3:42pm

    Hi Tahir,

    On https://www.computerfabriek.be/ you have a red Webshop menu item button.

    The menu on https://www.computerfabriek.be/particulieren/ is also using the Button Extra Color 1 style, but it’s not showing the button background.

    The only difference between the menus is that the main menu is marked as Top Navigation Menu, and the second one is displayed through the plugin. However, I don’t see any CSS differences between the two.

    Thanks
    Filip

  •  9,254
    Tahir replied
    3 weeks ago on May 9, 2025 at 3:47pm

    Hey Again,

    The menu item id gets changed therefore the css does not apply.

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    
#header-outer .menu-item-4252>a,#header-outer #top nav .menu-item-4252>a,#header-outer.transparent nav>ul.sf-menu .menu-item.menu-item-4252>a,#header-outer.transparent #top nav>ul.sf-menu .menu-item.menu-item-4252>a,body #header-outer[data-lhe="default"] #top nav .sf-menu>.sfHover:not(#social-in-menu).menu-item-4252>a,body #header-outer[data-lhe="default"] #top nav>ul>li.menu-item-4252>a:hover {
    color: #fff!important
}

#header-outer[data-has-menu="true"].transparent #top nav ul.sf-menu li.menu-item-4252>a:hover .nectar-menu-icon {
    color: #fff!important
}

#header-outer .menu-item-4252>a:before,#header-outer .menu-item-4252>a:after {
    position: absolute;
    top: 50%!important;
    left: -12px;
    width: calc(100% + 24px);
    height: calc(100% + 24px);
    content: "";
    display: block;
    z-index: -1;
    transform-origin: top;
    transform: translateY(-50%)!important;
    transition: opacity .45s cubic-bezier(.25,1,.33,1),transform .45s cubic-bezier(.25,1,.33,1),border-color .45s cubic-bezier(.25,1,.33,1),color .45s cubic-bezier(.25,1,.33,1),background-color .45s cubic-bezier(.25,1,.33,1),box-shadow .45s cubic-bezier(.25,1,.33,1)
}

#header-outer #header-secondary-outer .menu-item-4252>a:after,#header-outer #header-secondary-outer .menu-item-4252>a:before {
    height: calc(100% + 12px)
}

#header-outer .menu-item-4252>a:after {
    opacity: 0;
    transition: opacity 0.3s ease,transform 0.3s ease
}

#header-outer .menu-item-4252>a .menu-title-text:after {
    display: none!important
}

#header-outer .menu-item-4252>a {
    color: #fff
}

#header-outer .menu-item-4252>a:before {
    background: #a31c14
}

#header-outer .menu-item-4252>a:hover:after,#header-outer .menu-item-4252[class*="current"]>a:after {
    opacity: 1
}

    Thanks

    ThemeNectar Support Team 

  •  5
    Filip replied
    3 weeks ago on May 9, 2025 at 3:57pm

    Wow, that was a lightning-fast solution!
    Thank you so much, and have a great weekend!

    Filip