Site logo

Archived topic

Secondary navigation like in dispatch

9 replies · Started by Dr Hatice on January 24, 2023

Viewing posts 1–10 of 10

Hi Ying,
Thanks for your previous reply.

As you said, I placed this code in my additional css.

.inside-navigation.grid-container.grid-parent .main-nav:before {
content: "Articles";
color: #FFF;
padding: 20px;
font-size: 22px;
}

.inside-navigation.grid-container.grid-parent .main-nav {
display: flex;
align-items: center;
}

However I have two issues;
1- The text “Articles” appears both before the Primary and Secondary Navigation. I only want for the Secondary Navigation.
2- I couldn’t change/style background colour of the secondary navigation. (For instance I want to try grey like in dispatch - or a different color instead of white.)

Best regards,
Hatice

Hi Hatice,

Can you link us to your site?

1. Change the 1st CSS to:

.secondary-navigation .inside-navigation.grid-container.grid-parent .main-nav:before {
    content: "Articles:";
    color: #6e3741;
    padding: 20px;
    font-size: 22px;
}

2. You can change the secondary navigation color at customizer > layout > Secondary Navigation > navigation background.

Let me know if this helps!

Hi Ying,
Many thanks for your help.
All works ok now.
Hatice

Glad to hear that :)

Sorry but I realised one issue.
Can I exclude this 1st CSS from mobile and use Customizer Mobile Menu Label.

Because it is not fit properly. (Articles appear below mobile dropdown menu)
Thanks

Yes, you can change the 1st CSS to this:

@media(min-width: 769px) { 
    .secondary-navigation .inside-navigation.grid-container.grid-parent .main-nav:before {
        content: "Articles:";
        color: #6e3741;
        padding: 20px;
        font-size: 22px;
    }
}

Hi Ying,
Thanks a lot..

You are welcome   :)

This archived topic is closed to new replies.