Change Menu Colour When It's Sticky Konstra Template - Question | JoomShaper

Change Menu Colour When It's Sticky Konstra Template

JK

Johan Kooistra

Template 11 months ago

Hello all,

I would like to change the colour of the Konstra template when it's sticky, but it changes the template body style text as well:

I can chage the colour when you see the menu (initially when you load the page). Ben when you sroll down on the website, the menu color changes to dark grey/black.

If I change in the presets: Body text color, this menu bar is also changed, but also (as the option states) the body text colour is changed.

I would like to change the sticky header color only if that is possible, but I'm not that good with css.

Thanks a lot in advance

0
15 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176458

Hi

Use this CSS in your custom.css file

#sp-header.header-sticky{
  background-color: #2BA84A !important;
}
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176032

Hi

Thanks for contacting us. Could you please give me your site URL? So that I can check.

-Regards.

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176035
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176050

Use this CSS in your custom.css file

#sp-header.header-sticky #sppb-addon-1553066286252 #btn-1553066286252.sppb-btn-link{
  color: black !important;
}
0
JK
Johan Kooistra
Accepted Answer
11 months ago #176069

There was not an custom.css in the template, so I created one and put it in the css directory and included that line.

Unfortunately it didn't work :(

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176070

Hi

Please keep a full site backup and give me your super admin access.

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176073

See hidden content.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176074

Its already working. See the screenshots please. First the font color is white

https://prnt.sc/LBKqdTPSWCD_

Then when its sticky the menu font color is black.

https://prnt.sc/bk4uyyRNV00W

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176077

Oh then I'm sorry and didn't explain it well: It's the color of the menu bar itself which is the problem when going sticky.

I can change it, but the website body trext changes to that color as well.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176219

Hi

Could you please send me a screenshot of the portion you want to change?

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176246

I can change the color of Nr 1, but this also changes the Nr 2 and 3 to the same color.

This van be done in the presets, with "Body Text Color" but I only want to change the color of Nr 1 (the menu bar color when you have it sticky.

Thanks in advance!

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176359

Body texts color are different from header menu color. Header menu color does not effect the body text color.

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176371

I can adjust the header, but not when it's sticky, that is the same color as the body tekst color.

I hope I can clarify this:

When the page first loads, you have the menu bar color: Green (this is the color I want it to be). This is also the color I want it to be in it's sticky form (when you scroll down on the page).

You can only change that color by changing the BODY TEXT option in the presets. This also (logically) change the body text.

However I just want to change the color of the sticky menu header bar and not the body text. I probably need an extra css line for that, since it's not in the presets menu.

Thanks for your patience.

0
JK
Johan Kooistra
Accepted Answer
11 months ago #176466

That worked like a charm.

Thank you very much!

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 11 months ago #176473

Glad to know that. You are always welcome.

0