How to Customize Search Results Page Colors in SearchGro

Want to match the colors on your Search Results Page with your Shopify store's style? Here’s how you can do it:

Steps to Change Search Results Page Colors:

1. Log in to your Shopify admin and open the SearchGro app from the Apps menu.
2. In the SearchGro dashboard, click the Search tab in the left-hand sidebar.
3. From the sub-menu, select Search Results Page.
4. Click the Colors tab.
5. Use the color picker or enter a hex code to customize elements such as the background, titles, buttons, and hover states.
6. Click Save Settings to apply your changes.

Important Note:

If you customize the colors using the options in this section, the selected elements will no longer use your Shopify store’s default theme colors. As your selections override the theme styles for those specific parts of the Search Results Page.

List of Customizable Elements:

The Colors tab is organized into sections to help you manage different areas of the page. You can customize the following elements:

• Reset Colors: An option is available to revert all color customizations in this section back to their default values.

NAVIGATION BAR

Navigation bar text: Customizes the color of text used within the navigation bar.

• Navigation Bar border: Customizes the border color around the navigation bar.

• Grid Background: Customizes the background color of the product grid section.

• Active Grid Background: Customizes the background color for selected or active grid elements.

Product Card

• Title: Customizes the text color of the product titles displayed within the product cards.

• Description: Customizes the text color of the product descriptions.

• Price: Customizes the color for the standard price of products.

• Discount Price: Customizes the color for the discounted or sale price of products.

• Button Background: Customizes the background color of the on-hover buttons and the filter section buttons on the store.(e.g., Add to Cart button, Quick VIew ).

• Button text: Customize the text color on hover buttons and the filter section buttons on the store.

• Additional Field: Customizes the text color for any additional product field value, such as SKU.

Filters

• Titles: Customizes the text color of the filter section titles.

• Option Text: Customizes the text color of the filter options or values.

• Filter Background: Customizes the background color of the filter sections or panels.

• Reset Text: Customizes the text color of the 'Reset Filters' option or button.

• Border: Customizes the border color around the filter section container.

• Checkbox Border: Customizes the border color for checkboxes within the filter options.

                                                                                                                                                                                     By tweaking these color settings, you can integrate your Search Results Page with your store's design. Don’t forget to hit the Save Settings button after you’ve made your changes!

Need help?

Click “Help Me” and our chatbot will appear. You can then ask questions or request assistance in real time.

For email support, feel free to reach out to us at support@simprosys.com