Home / Forums / Basel support forum / Colored background
Home › Forums › Basel support forum › Colored background
Colored background
- This topic has 41 replies, 2 voices, and was last updated 4 years, 7 months ago by  Elise Noromit. 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