> For the complete documentation index, see [llms.txt](https://doc.storelocator.secomapp.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://doc.storelocator.secomapp.com/master.md).

# Instruction

### **Step 1: Add Store Location**

Go to **Stores** sections ➜ Get started by clicking **Add Store**

### **Step 2: Enter Detail Store Information**

* Go through General and Location Info Part to enter detailed store information like Store Name, Store Address, Description of the store, and other necessary information.
* After entering the exact address of the store, you can correct the location on the map in the last part by drag and drop the red pin. 
* After everything is done, remember to click Save and Publish to Shop!

### **Step 3: Configure Store Locator app**

Go to the Settings section. You will see there are 5 tabs that we need to go through:

#### 1. General Tab:

![](/files/xUVwceoOgKvNZcwI8bRR)

* Firstly, **enable Store Locator.**
* After that, please update the **API Key** to keep the app working properly for your site. (We recommend you to create your own API)

&#x20;       ➥ Get your own API Key with our following video guide: <https://www.youtube.com/watch?v=XXF1SiNJaKg>

&#x20;       ➥ Paste the API you just created in the API Key box ⇒ Click **Save**.

* You can set the Zoom Level of google map. The default value is 12.

#### **2. Search Tab:**

![](/files/MjR9Y4zckq0YlRcLWw0c)

* Enable **Auto detect Location** to detect the location of customers automatically when visiting the site.
* To configure the search feature on the frontend, you can go through the fields: Max Results, Search Radius, Default Search Radius, Default Search Measurement.
* To select what filter tags will be shown in the Search section, you can go through the fields: Display All Tags, Select Display Tags.
* Other fields allow you to change the style of the search section on the frontend.

#### **3. List & Map Tab:**

![](/files/sfDONN3egXsRkm3wBlzq)

The Store List section will display the search result and the Map section will show the location of stores on google map (with a popup to show the detail of the store).&#x20;

In these sections, you can configure what information of the store will be shown on the store list and store popup. You also can change the style of these sections.&#x20;

#### **4. Translation Tab:**

![](/files/WjruNxlyTTl1fyAoDNdk)

* This section allows you to change any text label which is displayed on the frontend. You also can translate them into other languages you want.

{% hint style="warning" %}
Remember to click **Save** and **Publish to Shop** after you have finished all the settings/ changes.&#x20;
{% endhint %}

#### **5. Advanced Customization:**

![](/files/oQaS0FaiifeR1RUKvRl3)

This section is for developers. Let your developers know which way to edit files to customize our Store Locator app.

### **Step 4: Display Store Locator on your website**

Now, let us instruct you on how to show Store Locator on your website’s main menu:

1\. Go to **Online Store** ➜ **Navigation** ➜ Click **Main Menu**

![](https://lh6.googleusercontent.com/sHZ7uhkCQCQ0Qffy_3pRB9KlbCWT-fSu6ObQ4j4yLSNEcrKvgWrag6QgfGrlkBuyz7TrFvvKfpyLlhpa8_x6jOaJQu1aQt35N3NS6PXeDWROlu2HeejHEH7hqtBqiZzzePttmSCi)

2\. At the Main Menu ➜ Click **Add menu item**, then enter Name and your Store Locator URL Link (Using the URL that is shown on the top of your backend).&#x20;

![](https://lh5.googleusercontent.com/0rK5Ougfj5085yHj3tNrih8-Nb-5IQL9c56vczSlalRK1e2AffB2eAv7c1APNLHhi1Nz9dGnIJ2IsU03nHejyIjhvB6JfRHZo5AmlBBrBxKGH1iIC3xgudULNmdzH8PSmEQL--Lx)

![](https://lh5.googleusercontent.com/A4pu5sgVdqL66uKiwfw9Wxr02imlJB-jPl1BrHWewJJ0AtqF_nBEoYbZlQ4re8-NR4Sq0HtddiNIvzDif6G-e0y972Xm7B3vftEBHAJkgZhpFVD28_7ENuoGjZWN4e9igGkZxXi0)

➜ Click **Add** and **Save Menu**. Then go to the frontend you will see the tab to Store Locations on the Main Menu.

![](https://lh4.googleusercontent.com/qqT69r-1JJZcFuDh_aDQ0oyhQ7Fs94y2vcp3igYnEMOGEnLRv0EFLgoG76nMFEaIiUiY84odkr0KX6I0Kth-DHPYBN1rUz7QyGXFwmju6nuZn4cT2mVaZzHMQfopDNnRb5trpzCM)

{% hint style="info" %}
&#x20;For any difficulties, please contact us via email: ***<support@secomapp.com>***
{% endhint %}