Home › Forums › Basel support forum › Colored background
Colored background
- This topic has 41 replies, 2 voices, and was last updated 3 years, 8 months ago by Elise Noromit.
-
AuthorPosts
-
March 10, 2021 at 7:04 am #272276
pierredemeudonParticipantHi there,
This is it. As to image, I don’t use revslider, maybe one of your demo that I used to start with? Anyway, yes, this css delivers what I was expecting, super!
I have been able to change to get the color to #FFF5EE as well in the header and footers, here theme makes it easy. That said, there is one thing: when you scroll down on a given page, the header is changing in size, but aslo in color, switching to white. How to keep #FFF5EE in the Header when scrolling down?
A suggestion: Maybe could you optimise the theme menu? “Site background” in “general layout” is potentially misleading. The 2 sides of WP are normally to be used for widgets and sidebars, whereas in Basel, widgets / sidebars are in the central section. Indeed, what you call “site background” refers to the 2 sides … whereas many could think that “Site background” refers to central part, or to full page, sides included like me.
Thanks again
March 10, 2021 at 7:16 pm #272514
Elise NoromitMemberHello,
Please add this code to the Theme Settings > Custom CSS > Global:
.sticky-header-prepared.basel-top-bar-on .header-shop.act-scroll{ background-color:#FFF5EE; }
Best Regards
March 11, 2021 at 6:02 am #272592
pierredemeudonParticipantHi,
Sorry, does not seem to work. To make it more standing out, I replaced #FFF5EE by deepskyblue #00BFFFhere are the css:
https://snipboard.io/iygn0C.jpghere are the header settings:
https://snipboard.io/fvitBq.jpgThe result when scrolling down:
https://snipboard.io/7x50Wj.jpgKind regards
March 11, 2021 at 2:01 pm #272754
Elise NoromitMemberHello,
I am a bit confused, please clarify once again what background you want to replace: sticky header or default header. Remove all the settings from the Theme Settings on the background.
Best Regards
March 11, 2021 at 4:52 pm #272787
pierredemeudonParticipantHello,
Sorry for the confusion. Will try to be clearer. Given what you wrote, for you, there are different headers (default, sticky, …) I don’t know what is for you the difference between sticky and default headers … there is only 1 header in your menu … though I guess the
Original purpose is to have all white becoming very pale orange -#FFF5EE-
Meaning backgrounds, header, footers, sidebards, widgets, etc.With the code below, it’s 90% OK
.main-page-wrapper {
background-color:#FFF5EE!important;
}– the first remaining issue is what I call Header: it is “#FFF5EE”, but when scrolling down, it becomes white … instead of staying #FFF5EE (or maybe the default colored header is replaced by a another one which is white?)
To make it clearer, I used blue instead of #FFF5EE, which is too close to white and not stressing the differences. In the screenshot below, all “backgrounds” are blue, including what I call “header” … but when scrolling down, it becomes white, instead of staying colored.
https://snipboard.io/tpVDkN.jpg– When using the code below, the “header” (the sticky?) after having scrolled down remains white. I.e. no effect of this code on “header”
.sticky-header-prepared.basel-top-bar-on .header-shop.act-scroll{
background-color:#FFF5EE;
}Hoping it’s clearer
Kind regardsMarch 11, 2021 at 10:27 pm #272860
Elise NoromitMemberHello,
Please update your site admin access I cannot log in.
Best Regards
March 12, 2021 at 6:41 am #272903
pierredemeudonParticipantHi
The credentials are the right ones, I think it’s because I updated the staging, what re-activated 1 security plugin on which you shall not be white listed.
All plugins are now desactivated.
Sorry, I missed this one.
Kind regardsMarch 13, 2021 at 9:55 am #273232
Elise NoromitMemberHello,
Please add this code to the Theme Settings > Custom CSS > Global:
body .main-page-wrapper { background: #FFF5EE; }
Best Regards
March 13, 2021 at 4:20 pm #273309
pierredemeudonParticipantHi,
You already gave me this code. It works for the body, but issue is on header, which is becoming white when scrolling down instead of staying in color #FFF5EE as defined in settings.To correct this, you gave me that code, that it does not solve the problem
.sticky-header-prepared.basel-top-bar-on .header-shop.act-scroll{
background-color:#FFF5EE;
}Kind regards
March 13, 2021 at 10:21 pm #273334
Elise NoromitMemberHello,
Please replace the code with this one:
.main-header.header-has-no-bg.act-scroll { background-color: #FFF5EE; }
Best Regards
March 14, 2021 at 6:25 am #273358
pierredemeudonParticipantHello,
Now it works perfect.
Probably you know but the 2 codes have to be on top of global CSS to work
If they are below other codes, it does not work
Thank you very luch
CheersMarch 14, 2021 at 10:17 am #273382
Elise NoromitMemberYou are welcome! If you have any questions please feel free to contact us.
Best Regards
-
AuthorPosts
- You must be logged in to create new topics. Login / Register