To set up the Store locator add-on:
- In the administration panel, go to Add-ons > Manage add-ons.
- Enable the Store locator add-on (change its status to Active in the select box on the right).
- Click on the name of the add-on, enter your Google Maps API key in the API key input field and click the Save button.
NOTE: You can get Maps API key here http://code.google.com/apis/maps/signup.html (you need to have Google Account).
- In the administration panel, go to Add-ons > Store Locator.
- Click the + button on the right to add store location.
- Fill in the necessary fields and click the Create and close button.
To add the Store locator block:
- Go to Design > Layouts > Default.
- Click the + button in the desired grid to add block. Choose the Create New Block tab and click the Store locator button. In the opened window:
- Enter the block name (e.g. Find our store).
- Select Store locator in the Template select box.
- Click the Create button.
- Click the gear button of the created block to see the block options.
- In the opened window select the desired wrapper in the Wrapper select box.
- Enter the user-defined CSS-class if needed.
- Click the Save button.
The Find our store block will be displayed on the
storefront. If customers enter the store name, city or country in the
input field in this block and click the Search button, they will see your store location closest to them on the map.
NOTE: After the block is created or changed, make sure it is displayed correctly. Sometimes not all wrappers are suitable for the blocks.