1. Kidzy
  2. Sunday, 19 July 2020
Hallo Support,
how can I adjust the background of # sp-top-bar differently on each page?
I find no way to assign your own ID to the # sp-top-bar.
I can change the color in custom.css, but only the same for everyone.
.itemid-101 .sp-top-bar { background-color: #8ac53f !important;} is not working.
Thank you for the answer
Responses (1)
Hi. You have two options. You can create a copy of the template style and add your class to the Top Bar section to use it for styling (You will need to disable the predefined header and create a custom top bar and header). And assign this copy to the desired pages.
In this case, the selector will look like this #sp-top-bar.your-class
Or you can use the page class in the menu item settings.
In this case, the selector will look like this .your-class #sp-top-bar
.itemid-101 .sp-top-bar { background-color: #8ac53f !important;} is not working.

This code doesn't work because the selector is not correct.
itemid-101 is not the parent of sp-top-bar and neither itemid-101 nor sp-top-bar are class names. They are object IDs. ID is written like this #sp-top-bar
  1. more than a month ago
  2. Kidzy
  3. # 1


There are no replies made for this post yet.
Be one of the first to reply to this post!


This forum is archived

This forum has been archived. Please use JoomShaper official support system.