Return to previous page

No settings to change the COLOUR of the search box results.

This topic has 11 replies, 2 voices, and was last updated 1 months, 3 weeks ago ago by Jack Richardson

Terpsauce

Participant

March 27, 2025 at 03:49

After previous discussion, and like the title suggests, there is no option to change the COLOUR of this in the settings. There is every option to change the colour of every other area apart from this.

Your response, 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.

My question was how to change the colour of it, not the layout.

and the screenshot you sent me doesn’t illustrate anything relevant, you have highlighted the input area. input area COLOUR options do not change drop down results COLOUR. The initial request begin why is there no options to change the drop down colour? The is option to change every other area.

Screenshots below show there is no option to change the COLOUR of the search results drop down which you provided half code for.

Files is visible for topic creator and
support staff only.

#438801 Copied

10 Answers

Jack Richardson

Support staff

March 31, 2025 at 09:11

Dear @Terpsauce,

Thank you for reaching out.

At the moment, it is not possible to customize the colors of the AJAX search results through the available settings. However, we encourage you to submit your suggestion on our Feature Request Board: https://www.8theme.com/roadmap/. This platform allows us to track and prioritize new features based on customer interest and votes. If your request gains popularity among other users, we will consider implementing it in a future update of our Search widget. We aim to develop features that benefit the majority of our customers.

If you require specific customization for your website, you are welcome to submit a request through your account here: https://www.8theme.com/account. Please note that all support services are provided in accordance with Envato’s Item Support Policy: https://themeforest.net/page/item_support_policy (https://prnt.sc/WWS4RXbOaWzV)).

We appreciate your understanding and thank you for respecting our support guidelines.

Best regards,
Jack Richardson
The 8Theme Team

#439247 Copied

Terpsauce

Participant

March 31, 2025 at 10:32

Users can’t see the text when searching on mobile.

Files is visible for topic creator and
support staff only.

#439267 Copied

Terpsauce

Participant

April 16, 2025 at 10:49

please advise

#440826 Copied
Jack Richardson

Support staff

April 17, 2025 at 15:52
Hello @Terpsauce
You can add next custom snippet:

body[data-mode=dark] .elementor-widget-theme-etheme_mobile_menu .etheme-search-input-form-wrapper input { color: #fff; }

Kind regards, Jack Richardson
The 8theme’s team
#441033 Copied
Terpsauce

Participant

April 17, 2025 at 17:23

Thanks it worked.

However,

1: The ‘X’ is still not visible because it is dark.

2: Is there anyway to change the colour of the search button, I adopt the same colour scheme for these kind of buttons.
#830213 Normal
#B30D02 Hover
If there is already a border, then #000000.

3: The screenshot attached shows the setting are set to display image and product stock, lower it does not. I always played with these settings to test, and when removing price it did nothing either, I think there must be a fault with the settings registering the change

#441048 Copied

Terpsauce

Participant

April 17, 2025 at 17:27

..

Files is visible for topic creator and
support staff only.

#441049 Copied
Jack Richardson

Support staff

April 18, 2025 at 07:33
Dear @Terpsauce,

Thank you for reaching out.

1. To adjust the color of the clear button in dark mode, you may use the following CSS:

[data-mode=dark] .elementor-widget-theme-etheme_mobile_menu .etheme-search-input-form-wrapper .etheme-search-form-clear { color: #fff; }

2. If you would like to apply custom CSS properties to the search button, you can use the following selector:

.elementor-widget-theme-etheme_mobile_menu .etheme-search-form-button-wrapper

For example:

.elementor-widget-theme-etheme_mobile_menu .etheme-search-form-button-wrapper { color: red; background: blue; }

3. Please note that we do not offer specific configuration options for the Search element within the mobile menu widget. This is because the mobile menu is designed to display only universal elements that are optimized for limited space. Advanced configuration options are available only for the original search widget used in the main header, and are not applicable to the mobile menu version.

Best regards,
The 8Theme Team
#441080 Copied
Terpsauce

Participant

April 18, 2025 at 08:55

Thanks for the code,

However, in response to number 3, the screenshot attached clearly shows the option for “content on mobile”, but the options are not working.

Files is visible for topic creator and
support staff only.

#441098 Copied

Terpsauce

Participant

April 22, 2025 at 11:17

Please advise, topic still open

CSS worked for 1 and 2. However there was no way to set the hover colour

#441430 Copied
Jack Richardson

Support staff

April 22, 2025 at 13:04
Dear @Terpsauce,

Thank you for your inquiry.

1-2/ if you would like to customize the hover effect of the search button, you may use the following CSS snippet:

.elementor-widget-theme-etheme_mobile_menu .etheme-search-form-button-wrapper:hover { color: green; background: orange; }

3/ In reference to your post (https://www.8theme.com/topic/no-settings-to-change-the-colour-of-the-search-box-results/#post-441098), the settings you are referring ara available in the Header Search widget, which is not displayed within the mobile content of your header.

Please note that there are currently no specific settings available for the search element within the Mobile Menu widget that would allow you to configure the appearance of the search results in that context.

We hope this helps. Should you have any further questions, please do not hesitate to reach out.

Best regards,
Jack Richardson
The 8Theme Team
#441440 Copied
Viewing 11 results - 1 through 11 (of 11 total)