Search Bar Color

Hello!

I Would like to change the header background color, or put some image. But i’m using the dark mode, so if I configured the background to a light color, the search bar edge and the text on there get lost for being white.

There’s a way to change for a dark grey or black?

Hello,

You can change the color of the header in the rows settings: https://xtemos.com/docs/woodmart/header-builder/header-rows-columns-configuration/

Best Regards

Hi Elise! Thank you!
Thas’s ok. the problem is when i set the background on light color. Because i’m using the dark mode of the site, and the search bar stay white.

I attached screenshots

https://ibb.co/9h34J7r
https://ibb.co/yp4Tf5k

I wanna change the color of the search bar and the text on there, but i couldn’t find the way.

Hello,

Please provide the site admin access to the private area.

Best Regards

Here is the access

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

 .woodmart-dark .searchform .search-by-category .input-dropdown-inner,
.woodmart-dark .searchform .search-by-category .input-dropdown-inner>a,
 .woodmart-dark .searchform .searchsubmit,
.woodmart-dark .searchform input[type=text]{
	  border-color: red!important;
    box-shadow: none;
    color:red!important;
}

Set your colors and you will get the result like this https://prnt.sc/tt6jor

Please have a look – https://prnt.sc/tt6ksk this the placeholder, it can be changed with CSS once for the whole site. I do not change it here as it would not be visible on the mobile.

Best Regards

Thank you Elise!! It works fine!!

Only one more thing, the “search for product” text before enter to write is still white, that can also be changed?

Hello,

That was I tried to explain, I can change it, however, the feature of the placeholder (this text before you enter something is called “Placeholder”) is that it can be changed once for the whole site. If I set it red, it would be red here as well – https://prnt.sc/ttc1l1

It is not possible to make it red, for example, on desktop and light grey in the mobile menu, you see?

Best Regards

Oh, sorry! I didn’t see the arrow, I don’t know why!
And how the logo was “selected”, added to my bad english, I thought you were referring to the length of the search bar or something like that… was my mistake.

Now I see and undesrtand… mmm, I think for now I will keep it light grey. It’s look ok.
If I change my mind later I will write to you again.

One more time, thank you very much!!!

Hello,

Ok. If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts