Home/Blogs/Cs-Cart Advance Live Search Addon

Cs-Cart Advance Live Search Addon

A powerful and functional set of search tools for your store.

The add-on is compatible with the entire cs-cart with such editions as CS-Cart, CS-Cart Ultimate, Multivendor, Multivendor Plus, Multivendor Ultimate. At the moment there is no information about the complete incompatibility with any theme. Matching search results are displayed as you type a query and are sorted not only by the best match to the query, but also according to the built-in smart search algorithm, in which the most relevant results are displayed above.

Feature:-

Search for products, categories, and text pages on your website store.
Browse products by category directly in the search popup block.
Keyboard navigation through the search results.
Settings of the fields for which you want to search.
Boost search functionality is also available.
This addon gives you one pre-installed theme admin can use that theme and can customize also and the ability to create new multiple themes and set a different active theme for different multi storefronts.
Well-integrated with CS-Cart, CS-Cart Multivendor.

Installation:-

How To Install Advance Live Search Addon

Addon-Installation: For the installation process you need to go to Add-ons > Manage add-ons > then click on the gear button and choose manual installation then there is a pop-up of manual installation that is open and you can choose an option to upload addon zip and install the addon.

How to Upload Zip file

1. Click on setting>Manual installation a pop window will be displayed.

you can install an add-on by picking a tgz,gz,zip format archive and clicking Upload & install.

2. Add-on installed.

After Successfully installing the add-on Goto >Add-on on the administration panel Add-on>Manage Add-on>Ecarter Technology Pvt. ltd. you see no. of installed add-ons or newly installed add-ons and add-ons must be Active/On status if the addon is Disable it is not working.

Open the addon Let's check how the addon works.

Click on >> Appereance, the appearance page will open on that page admin customize the search theme.

This is the appearance page from here admin can customize the search bar.

Now let's see how to customize the theme.

1. Base settings

Storefront:- First select the storefront for which you want to customize the search bar or select all which is one theme is common for all storefront.
Select theme:- Here create a new theme you can create multiple themes. click on >> create new theme.
Create new theme:- Give the name of the theme.

Theme status:- After creating the theme select the theme and tick the checkbox so the theme applies on the storefront.

Base background:- The admin can change the base color of the theme as mentioned below in the image which is the base color.
Header color:- Admin can change the header color of the theme as mentioned below in the image which is the header color.
Header background color:- Admin can change the header background color of the theme as mentioned below in the image which is the header background color.
Border radius:- Admin can change the border radius of the theme as mentioned below in the image which is the border-radius.

2. Categories Settings

Categories background:- The admin can change the categories background color of the theme as mentioned below in the image which is the categories background.
Categories text:- The admin can change the categories text color of the theme as mentioned below in the image which is the categories text.
Border radius:- Admin can change the border radius of the theme as mentioned below in the image which is the border-radius.

3. Product settings

Product text:- The admin can change the product text color of the theme as mentioned below in the image which is the product text.
Product Background:- The admin can change the product background color of the theme as mentioned below in the image which is the product background.
Categories background:- The admin can change the categories background color of the theme as mentioned below in the image which is the categories background.
Categories text:- The admin can change the categories text color of the theme as mentioned below in the image which is the categories text.
Quick access:- The admin can change the quick access color of the theme as mentioned below in the image which is the quick access.
Categories Border radius:- Admin can change the border radius of the theme as mentioned below in the image which is the border radius.
Image Border radius:- Admin can change the image border radius of the theme as mentioned below in the image which is the image border-radius.

4. Other settings

Load more text:- The admin can change the load more button text color of the theme as mentioned below in the image which is the load more button text.
Load more background:- The admin can change the load more button background color of the theme as mentioned below in the image which is the load more button background.
Load more border radius:- The admin can change the load more button border radius of the theme as mentioned below in the image which is load more button border-radius.
Keyboard highlight:- The admin can change the keyboard highlight color of the theme as mentioned below in the image which is the keyboard highlight.

Now go to appearance settings

Here you see all themes which is created you can also delete the theme if you want to remove the theme.

Now go to general setting page here you see three tabs General, Product and Search from here admin can customize or change the settings and make live search works smoothly.

First let's see what's on general tab and after that remaining tabs one by one.

1. General Tab

Minimum character:- In this set minimum character value so when user searches for the product he must write the minimum character value for (eg. here if the user searches the product he must enter at least 3 letters or character).
Items per request:- On the search page how many products can be visible?
Keyboard navigation: From keyboard navigation keys the user can navigate the products.
Load more:- Load more has two types one is scroll and another is button they are used to load more products.
After that click on >> save button.

2. Products Tab

In this tab there are multiple settings and checkboxes they are the product setting if admin uncheck then the product don't show the information. If check the box then the product show wit all the inforamations.

After that click on >> save button.

3. Search Tab

On this tab admin can set when searching for the product wants to display categories to identify which product belongs to which categories. From this setting user search subcategories also and there is one main feature boost search to search the products after that save the settings.

Now go to the stop words page

Here we add the stop word, the use of adding stop word is the user not able to search for that product or category.

Click on the >>(+) icon to create a stop word.

Enter word or categories name, product name in search query so the user will not be able to search for that stop word.
Add stop words related to the search query words.
Then click on >> Add button.

Here you see the some stop words are added when the user search for these words user will not be able to search the product or categories or any word related to these stop words which are added.

Hover on the stop word and by clicking on >> gear button, the admin can delete or edit the stop word.
Or change the status Active/Disable of stop word.

Click on >> edit button to edit the stop word.
Update stop word page will open.

Here you can update the stop word like change the name of a search query, status and add more stop words or remove stop words.
After that click on the >> update button.