#138476 Navigation

Landing Forums JupiterX WordPress Theme Navigation

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • info-4cd16ee3

    Dear Team,

    on the homepage both navigation elements “Startseite” and “Leistungen” are active and red, even if the “Leisungen” is linked to an widget way more down the page.

    I want “Leistungen” to be unactive and gray when I click on the logo or “Startseite”, but can’t find how to change this. Could you please advise.

    Thank you

    Bela

    Nodari Support Team

    Hi Bela

    The problem happens because you have a custom link menu element under the custom link menu element and they both are pointing to the homepage section, there is also a state when 3 menu elements are the active same time, under the Leistungen menu, this happens because their anchor points are in the same row. There is no out of the box solution for these conflicting styles, first of all, I recommend reviewing the setup of your menu structure,

    Hovewer I also have solution for you, please add this css code in the Appearance > Customize > Additionall css:

    .home .menu-item-713 > a {
        color: #7A7A7A !important;
    }
    .home .menu-item-713 > a.raven-menu-item-active {
        color: #CF110C !important;
    }

    Regards

    info-4cd16ee3

    Dear Nodari,

    Thanks for your answer and for the css code. I have implemented it and the second navigation point is no longer red on start, but now the first 2 act differently than the rest.

    ‘Leistungen’ won’t go red on hover and  the red lines on the right and the left side as the rest of the navigation. And ‘Startseite’ also don’t show the red lines on the right and the left side on hovers.

    Is there any way to fix that?

    Thank you
    Bela

    Mohsin Al-Rabieai Support Team

    Hi Bela,

    This css is as far as we can go with the current features of WordPress:

    .home .raven-nav-menu-main .raven-nav-menu > li.menu-item-713.current-menu-ancestor > a {
        color: #636465;
        border-style: solid;
        border-width: 0px 2px 0px 2px;
    }
    .home .raven-nav-menu-main .raven-nav-menu > li.menu-item-713.current-menu-item > a.raven-menu-item {
        font-family: "Poppins", Sans-serif;
        font-size: 15px;
        font-weight: 600;
        letter-spacing: 1px;
        padding: 0px 5px 0px 5px;
        color: #636465;
        border-color: rgba(255,255,255,0);
        border-style: solid;
        border-width: 0px 2px 0px 2px;
    }
    
    .home .raven-nav-menu-main .raven-nav-menu > li.menu-item-713 > a.raven-menu-item:hover {
        color: #CF110C;
        border-color: #CF110C;
        border-style: solid;
        border-width: 0px 2px 0px 2px;
    }

    Please use this instead of the older CSS snippet. If you need more than that, you need to contact WPDone to write a JS feature for you. Thanks for your understanding.

    Bests

Viewing 4 posts - 1 through 4 (of 4 total)
You must be logged in to reply to this topic.
Login