Return to previous page

No settings to change the colour of the search box.

This topic has 10 replies, 4 voices, and was last updated 9 hours, 25 minutes ago ago by Jack Richardson

  • Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 23, 2025 at 03:31

    Two images attached, on shows the all departments menu, one shows the search box function. Is it possible to change the colour of the background of the search, from white to grey

    Files is visible for topic creator and
    support staff only.
    #438328 Copied Theme version: 9.4.8
    9 Answers
    Avatar: Alex Carter
    Alex Carter
    Support staff
    March 24, 2025 at 08:38

    Hello, Terpsauce,

    Thank you for reaching out to us.

    We have received your request along with the attached images. Yes, it is possible to change the background color of the search box from white to grey using custom CSS code:

    .elementor-location-header .etheme-search-form-more, 
.elementor-location-header .etheme-search-form-title,
.elementor-location-header .etheme-search-trending-searches {
    background-color: rgb(26, 26, 26);
    color: white;
}
.elementor-location-header .etheme-search-trending-search-wrapper:hover {
    background-color: #222;
}

    Warm Regards,
    The 8Theme Team

    #438368 Copied
    Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 24, 2025 at 08:55

    where do I apply the css, to container, or general css, please elaborate.

    #438376 Copied
    Avatar: Alex Carter
    Alex Carter
    Support staff
    March 24, 2025 at 09:57

    Hello, Terpsauce,

    Thank you for reaching out to us.

    You can apply the CSS either to a specific container or in the general CSS (Theme Options > Theme Custom CSS > Global).

    Best regards,
    8Theme Team

    #438393 Copied
    Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 24, 2025 at 10:46

    Your solution doesn’t actually change the search results, just the search suggestion.

    Also can’t see any setting to neaten up the button to match the style of all buttons on site? Doesn’t appear to be modifyable by text alignment or size/shape

    Files is visible for topic creator and
    support staff only.
    #438409 Copied
    Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 24, 2025 at 10:48

    Alos, no chnages showing on mobile.

    And the text within search box is black, and not visible.

    Files is visible for topic creator and
    support staff only.
    #438410 Copied
    Avatar: Justin
    Luca Rossi
    Support staff
    March 24, 2025 at 17:18

    Hi @Terpsauce,

    Please try with this custom CSS codes instead:

    
body .etheme-search-form .autocomplete-suggestions {
    background-color: #f0f0f0;
}

body .etheme-search-form-more {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

body .etheme-search-form-more button {
    text-align: center;
}

body .etheme-search-form-more button span {
    border: none;
}

    Hope it helps!

    #438485 Copied
    Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 25, 2025 at 08:57

    Ive applied this code, removed the last code.

    This code does absolutely nothing apart from, modify the layout of search result buttons.

    Files is visible for topic creator and
    support staff only.
    #438538 Copied
    Avatar: Mr.Auxins
    Terpsauce
    Participant
    March 25, 2025 at 08:59

    no changes here either

    Alos, no chnages showing on mobile.

    And the text within search box is black, and not visible.

    #438539 Copied
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    March 26, 2025 at 10:42

    Dear @Terpsauce,

    Thank you for reaching out to us.

    There are many settings that allow you to customize the layout of Search header widget -> https://prnt.sc/zmubZXtME3bl, please, take a moment and configure according to your needs.

    As per Envato’s support policy https://themeforest.net/page/item_support_policy, additional customization services is out of our basic support scope. You can find more details here: https://prnt.sc/EM4Eg9ZPYnJB.

    However, you are welcome to submit your request for customization on your account page: https://www.8theme.com/account/.

    Please let us know if you need any further assistance.

    Best regards,
    Jack Richardson
    8Theme Team

    #438769 Copied
  • Viewing 10 results - 1 through 10 (of 10 total)

The issue related to '‘No settings to change the colour of the search box.’' has been successfully resolved, and the topic is now closed for further responses

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Phone Service – WordPress WooCommerce Theme
lazy-placeholder
Kidsstore – WooCommerce Theme
lazy-placeholder
Interior – WordPress WooCommerce Theme
lazy-placeholder
Designers – WordPress Theme
lazy-placeholder
Organic Cosmetics Store – WordPress WooCommerce Theme
lazy-placeholder
Restaurant – WordPress Theme
lazy-placeholder
Artmaxy Store – WordPress WooCommerce Theme
lazy-placeholder
Cocktails Store – WordPress WooCommerce Theme
lazy-placeholder
Classic Fashion Store – WordPress WooCommerce Theme
lazy-placeholder
Web Agency – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.