Rapid Search

0. Useful information regarding the Rapid Search Custom Search Bar:

The search engine of Rapid Search will run in your store after installation, the "Custom Search Bar" term refers to a search bar that is added optionally, replacing your default search bar or search icon of your theme, that can be customized in its design.

1. How to start:

If your store does not have a search bar, or you wish to replace the search bar in your store, you can do this with a few clicks in the Rapid Search Admin > Settings > Custom Search Bar menu > by clicking on the "customize your search bar" button.

You will be redirected to the Theme settings of your Shopify Admin. 

By default, the Custom Search Bar will be attached to your header. You can attach the search bar to another element when you have the "Enable picker" option selected and click an element.

So if you would like your search bar to be placed next to a text in your header, click on the text. 

After you click on the text, the search bar will immediately appear next to it. This attaches the search bar under the chosen element, and you can change the position.

Please do not forget to hit both the Save buttons for the search bar to be added to your live store, otherwise, it remains visible in the Preview only! The orange button is to make sure that the placement of the search bar is saved (so this one will appear around the search bar at all times), and the black button is to save all remaining changes.

It is important that you choose the larger element to be exact with the placement of the search bar. So for the cart icon for example, please choose as per above, and NOT:

It is also important to have the Shopify Inspector tool disabled when you'd like to attach your CSB to an element, otherwise, clicking the element won't have any effect. Fortunately, Shopify will warn you if this is the case with a text on the bottom of your page.

2. Customize your search bar:

The custom search bar editor places the search bar next to the chosen element, but you can change the placement. You can also change the colors of the search bar to match your theme. You can either choose a color from the color picker or enter a color code.

You may want to change what you see in the search input field. The search bar placeholder can be changed to say "Search" in your store's language or even call out to users i.e. Search for the best cars in the country, etc. Be creative!

You can also change the size of your search bar (in pixels), so increase/decrease the width or height, it can be long, short, big, tiny, whichever suits you the best:

You can choose if you would like the search bar to appear on desktop or mobile devices or both.

Please note that for mobile devices, the search bar will always be placed under the header - you can still customize the colors and the size of the search bar. :-)

And for those with some CSS skills, you can edit custom CSS if you wish to make your search bar even more unique:

Important additional information regarding adding custom CSS in Rapid Search:

You can find two different "Custom CSS" buttons in the Rapid Search app. 

- The one found in the Settings > Custom Search Bar menu will be active only when the custom search bar is added to your store. By removing the custom search bar, you will delete all custom CSS added within this menu as well. We recommend you only use the search bar-related CSS here. 

- For changes made to the Rapid Search result page or other instances (the ones you'd like to keep even without having Custom Search Bar) we recommend you use the Custom CSS button in the Rapid Search Admin > Settings > Design menu.

3. Are you stuck?

Please note that our custom search bar editor is still in Beta version. Should you experience any issues, please click on the chat icon in the right bottom corner to contact us. This will pop up a chat window, and you can send us your request directly and if you reach us within working hours, we aim to respond as soon as possible.

4. Complete your search bar:

When you are done customizing your search bar, simply click on both Save buttons. After having saved, you can view your brand new search bar after refreshing your storefront. :-)

Have you created a search bar, but you wish to remove it? No worries, simply click on the enabling/disabling button for the Rapid Search CSB app embed and Save.