# store-locator

> Shopify pickup locations on a Mapbox map, with a list filtered by a query field.

Status: Ready (Smootify 2.0)  
Add-on: Store Locator  
URL: https://www.smootify.io/docs/reference/elements/store-locator  
Updated: 2026-10-13

## At a glance

| Part | What it is | Without it |
|---|---|---|
| a Custom element with the tag `map` | the map is drawn in it; give it a height in its styles | the store locator is removed |
| a Custom element with the tag `store-location` | the template of one store in the list | there is no list |
| a Custom element with the tag `map-marker` | the marker of each store on the map, designed as you like, such as an icon | the map has no markers |
| optional: a Custom element with the tag `store-popup` | the card that opens over a marker when it is clicked | a click on a marker moves the map and marks its store in the list, with no card |
| optional: a Form Block with a Text field whose **Name** setting is `query` | searches the list as the visitor types, on any text of the store, such as the city or the postal code | the list is not searched |
| optional: an element with `condition="no-stores"` inside `store-locator` | shows while no store matches the search | an empty list |

More in [the guide](https://www.smootify.io/docs/features/store-availability#2-a-store-locator-page).

## Where it can go

- **Anywhere** on the page.
- **Must contain** [`map`](https://www.smootify.io/docs/reference/elements/map).
- **Out of place,** Smootify removes it from the page: also without data-api-key, or when the shop has no locations.

## What it requires

- The **Store Locator** extension (lite or server plan, or the extension activated in the Smootify dashboard). Without it, the element does nothing.

## Fields in the form

Each field’s **Name** setting in Webflow tells Smootify what the field holds. It is a setting of the field, not a custom attribute.

| Name | Field | What it does |
|---|---|---|
| `query` | Text field | The place to search for. |

## Attributes on the element

- **It reads** `data-api-key`, `data-style`, `data-zoom`, `data-initial-zoom`, `data-fit-bounds`, `data-padding`.

## Attributes inside it

| Group | Attribute name | Values |
|---|---|---|
| [Store](https://www.smootify.io/docs/reference/attributes/store-locator) | `location` | 6 |
| [Store locator (condition)](https://www.smootify.io/docs/reference/conditions/store-locator) | `condition` | 1 |