Archived topic

How to adjust background color of sticky nav only?

3 replies · Started by Stephen on June 30, 2021

Viewing posts 1–4 of 4

June 30, 2021 at 6:52 pm #1840428

I see how to adjust the primary nav colors (incl background and hover). But how do I set the background color for the sticky nav when the user scrolls down? The current transparent background on Catalyst template is very hard to see.

June 30, 2021 at 7:45 pm #1840455

Hi Stephen,

You can add custom CSS for that.

Example: changing the background to red.

nav#mobile-header,
nav#sticky-navigation {
    background: red;
}

July 1, 2021 at 6:50 am #1840954

Seems like there ought to be a setting for that in colors. Thanks.

July 1, 2021 at 7:03 am #1840974

Hi there,

the Sticky Navigation uses the Customizer > Colors > Primary Navigation - adjust those colors with the sticky in view.
Then edit the Merged Header Elements that Catalyst uses in Appearance > Elements

There are two:
Home Page
Global

Now on the Site Header tab edit the colors for your merged header.

This archived topic is closed to new replies.

Start building better websites today.