Home › Forums › WoodMart support forum › Search Bar Color

Search Bar Color

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • July 31, 2020 at 4:41 pm #215762

    Aslan
    Participant

    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?

    August 1, 2020 at 7:43 am #215866

    Elise Noromit
    Member

    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

    August 1, 2020 at 11:46 pm #215936

    Aslan
    Participant

    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.

    August 2, 2020 at 9:03 am #215974

    Elise Noromit
    Member

    Hello,

    Please provide the site admin access to the private area.

    Best Regards

    August 3, 2020 at 4:50 am #216125

    Aslan
    Participant

    Here is the access

    August 3, 2020 at 12:09 pm #216208

    Elise Noromit
    Member

    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

    August 3, 2020 at 3:07 pm #216262

    Aslan
    Participant

    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?

    August 3, 2020 at 4:49 pm #216284

    Elise Noromit
    Member

    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

    August 3, 2020 at 5:42 pm #216299

    Aslan
    Participant

    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!!!

    August 4, 2020 at 7:39 am #216375

    Elise Noromit
    Member

    Hello,

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

    Best Regards

  • Author
    Posts

Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)