Skip to main content

Build a locator with location search and radius

This setup is suitable for a compact “find stores near me” locator. It requires a Search form containing a location field and a locator layout containing the distance/radius control and results.

1. Create the Search form​

  1. Go to Store Locator → Builder → New → Search form.
  2. Give the form a recognizable name, such as Location + radius search.
  3. Add a location/search field.
  4. Add category or custom-field controls only if needed.
  5. Configure the search button and field labels.
  6. Save the form.

2. Add it to the locator​

  1. Open the required Layout in the Builder.
  2. Add or select the Search widget.
  3. Choose the Search form created above.
  4. Add a Distance filter widget near the search control.
  5. Add Result count, Store List, and Map widgets.
  6. In the Store List settings, choose the store card and results per page.
  7. Enable the desired pagination or Load more behavior.
  8. Save the layout.

3. Configure global search behavior​

Go to Store Locator → Settings → Search. Choose kilometres or miles, optionally restrict search using comma-separated ISO-2 country codes such as US,CA, and enable Address autocomplete if your provider supports it.

4. Test the controls together​

Use a private window and follow this exact order:

  1. Search for an address.
  2. Confirm distance appears on cards.
  3. Change the radius and confirm the origin is retained.
  4. Select a category and confirm radius remains active.
  5. Sort by distance and verify nearest-first order.
  6. Select Load more and confirm appended results use the same origin, radius, unit, filters, and sort.
  7. Use browser geolocation, then change radius again.

If the distance disappears after step 3, the radius request lost its latitude and longitude. See Search, radius, and distance.