Store Locator page

In order to work correctly, the plugin automatically creates the store locator page on your site through the shortcode [yith_store_locator].

Store Locator shortcode

How to configure the loader

In the plugin General settings, you will find the options to configure the loader that will show on the store locator page. Let’s analyze them together:

Configure the loader

  • Set a default loader or custom loader: by selecting Custom loader, you can upload and use your own loader; by choosing Default loader, you can set the loader through the following available options…
  • Default loading icon: choose one of the four different icons;
  • Loading icon size: choose the size of the loading icon from Small, Medium and Big;
  • Loading icon color: choose the color of the loading icon;
  • Overlay color: choose the overlay color of the loading icon.

Custom code

If you want to customize some elements, the plugin allows adding custom CSS and custom JS from the Custom code section of the General settings.

Custom CSS

Custom JS

Search settings

From the Search tab of the plugin panel, you can configure all the settings related to the search box and form that will show on your store locator page. You can choose to show or hide the search bar and/or use the instant search. Let’s analyze all the options.

Search bar

Configure store locator search settings

  • Show the search box: if enabled, the search bar will show on the store locator page and you will be able to configure all the options you can see in the image above;
  • Search form colors: choose the background and placeholder colors of the search form;
  • Enter a text to display inside the search form: enter the placeholder address/city for the search bar;
  • Upload icon for search bar: this allows uploading a custom icon to show in the search bar;
  • Enter a title for “search” feature: enter the title you want to show above the search bar.

Instant search

If you want the search results to load automatically without the need for users to click on the Search button, enable the option Use instant search.

Enable instant search

On the contrary, if you prefer to show the Search button to let users get the results of their search, disable the Use instant search option and configure the text and colors of the button through the options shown below.

Configure search button

 

Geolocation settings

To give users the possibility to use their position automatically for the search, you must activate the Enable geolocation feature in Geolocation settings.

Enable geolocation option

You can decide to use a button or a text link to let users activate their geolocation. Text, button and icon can be customized through the options available.

Configure geolocation style

If you want to show the users’ position automatically, you must enable the Enable auto geolocation option. After activating it, users will get an alert when opening the store locator page.

Enable auto geolocation

User's geolocation on frontend

 

View all stores

To show users the button View all stores on your store locator page, you must enable the Show View all stores button option.

Show View all stores button

You can decide to use a button or a text link to let users view all the stores in the results list. Text, button and icon can be customized through the options available.

Configure View all stores settings

Search results

You can customize both the title of the results list and the text to show when the search doesn’t generate results through the options that you find in the Search results section of the Search tab.

Search results options