The quickest way to add a store locator to Shopify is the StoreRocket app from the Shopify App Store: install it, add your locations, match your brand, and it creates a Store Locator page for you. If you would rather place the locator on a page you already have, paste the standard embed code into a Custom Liquid section instead.
We make StoreRocket, so weigh our view with that in mind. You can create your locator with a free trial, no credit card needed, and try either route. This guide covers both routes, plus the data, design, and testing work that makes the finished page useful to shoppers.
Related: StoreRocket for Shopify | Best store locator for Shopify | What is a store locator?
The short answer
A free map or app is enough when
- You have a handful of stores that rarely change and visitors only need to see where they are.
- A free Shopify store locator app or an embedded Google Map with a pin for each store already shows what you need.
- You are happy to update each location by hand when something changes.
- Nobody on your team needs analytics, lead capture or a spreadsheet import.
Use StoreRocket when
- You want a Shopify app that creates the Store Locator page for you.
- Your list is long or changes often, and your team should update it from a dashboard or a spreadsheet import instead of editing the theme.
- Visitors should search by address or postcode, filter, see opening hours with Open Now and get directions in Google Maps.
- You would rather not build and maintain a locator yourself. StoreRocket maintains the hosted locator and delivers updates through the embed already on your site.
Only a few locations and no budget? You may not need a store locator at all. A free embedded map with a pin for each location is fine when the list is short, rarely changes and visitors only need to see where you are. Our guide to free store locator options compares them.
Choose the Right Shopify Setup
You have three practical options.
| Route | Best for | What you manage |
|---|---|---|
| Native Shopify app | The fastest StoreRocket setup | Locations and design in StoreRocket |
| Standard embed | An existing page or custom Liquid section | Page placement in Shopify |
| Custom build | Requirements no existing locator can cover | Code, map APIs, hosting, and maintenance |
For most Shopify stores, start with the native app. The manual embed is useful when a theme or page builder gives you a specific place for the locator.
Method 1: Install the StoreRocket Shopify App
1. Install StoreRocket
Open StoreRocket in the Shopify App Store, select Install, and choose your store. The app connects the Shopify store to a StoreRocket project, creates a Store Locator page in your store, and takes you into the setup flow.
Start with a free trial, no credit card needed. StoreRocket supplies the map key during the trial. After subscribing, connect your own Google Maps or Mapbox key so map usage is billed directly by that provider.
2. Add Your Locations
Choose the method that matches how your location list changes:
- Manual entry for a small list or one-off additions
- CSV or Excel import for an existing spreadsheet
- Google Sheets sync (depends on the plan): StoreRocket creates a linked spreadsheet your team edits, synced daily or with Sync from Sheets
- REST API (depends on the plan) for an internal system or custom integration
At minimum, prepare a name and full address for each location. Phone numbers, opening hours, websites, photos, and custom fields make each result more useful.
3. Match the Locator to Your Store
Set the colors, marker, map style, search radius, and information shown in each result. Add filters only when they help a shopper make a real choice, such as services, store type, or a product range you maintain for each location.
Preview the locator at both desktop and phone widths. The important checks are simple: search is obvious, results are readable, directions open correctly, and the map never forces the page sideways.
4. Publish the Locator Page
The app creates the Store Locator page, so follow the install screen to see it in your store, then add that page to the store navigation with a direct label such as Find a store, Stores, or Where to buy.
Open the published storefront page and test it as a visitor. Search for a city near one of your locations, open a result, check the opening hours, and follow the directions link.
Method 2: Add the Standard Embed
The same StoreRocket locator can be added wherever Shopify accepts a custom HTML or Liquid block.
Copy the embed code shown on your StoreRocket Install page. It already carries your account ID, so paste it exactly as copied. Do not reuse an account ID from an example or another store.
For a Google Maps locator the code looks like this, with your own account ID in place of YOUR_ACCOUNT_ID (a Mapbox locator loads widget-mb.js instead):
1<div id='storerocket-widget' style='width:100%;' data-storerocket-env='p' data-storerocket-id='YOUR_ACCOUNT_ID'></div>
2<script>(function(){var a=document.createElement('script');a.type='text/javascript';a.async=!0;a.src='https://cdn.storerocket.io/js/widget.js';var b=document.getElementsByTagName('script')[0];b.parentNode.insertBefore(a,b);}());</script>
Add It to a Custom Liquid Section
- In Shopify Admin, open Online Store → Themes.
- Select Customize on the active theme.
- Open the page template that should contain the locator.
- Add a Custom Liquid section.
- Paste the code from your Install page and save.
Theme labels can move as Shopify updates the editor, but the pattern stays the same: use a block that accepts HTML and JavaScript, then publish the page that contains it.
Add It Through a Page Builder
If your Shopify store uses a page builder, place the code in its HTML, code, or embed element. Preview mode may restrict third-party scripts, so verify the published storefront page as well as the editor preview.
Method 3: Build a Custom Locator
A custom build gives you control over every interaction, but it also makes your team responsible for the location database, search logic, filters, mobile layout, accessibility, map-provider billing, and API changes.
This route makes sense when the locator is a core part of a larger custom product and an off-the-shelf tool cannot meet the requirement. For a standard Shopify store finder, the app or embed route gets to a reliable result much faster. If you are weighing it, our guide to building a store locator with AI lists what a custom build needs.
Prepare Location Data That Shoppers Can Use
A locator is only as useful as the location data behind it.
| Field | Why it matters |
|---|---|
| Name | Distinguishes branches, dealers, or store formats |
| Full address | Powers geocoding, search, and directions |
| Opening hours | Prevents a wasted trip |
| Phone and website | Gives the shopper a next action |
| Filters | Narrows results by a meaningful service or category |
| Photos | Helps shoppers recognize the location |
Use one row per location in a CSV or Google Sheet. Keep addresses in separate columns when possible, and use consistent names for filter values so you do not end up with near-duplicates such as “Pickup,” “Pick up,” and “Store pickup.”
Configure the Shopping Experience
Search and Results
Choose a default search radius that fits the business. A dense city network needs a tighter radius than a national dealer network. Show enough results to give shoppers a choice without turning the panel into an endless list.
Keep the primary actions blunt: Directions, which opens Google Maps, and Visit website, with the phone number in the location details. Opening hours and distance should be visible without making the shopper hunt through decorative copy.
Filters
Useful Shopify filters often describe:
- Pickup availability
- Services such as alterations, repairs, or consultations
- Store format such as flagship, outlet, or pop-up
- Product ranges that are maintained for each location
A filter is not live inventory unless it is connected to an inventory system. Use Shopify's own inventory and local-pickup tools for real-time stock; use locator filters for categories your location data can keep accurate.
Mobile
Most locator friction shows up on a phone. Test the real storefront for:
- A search field that remains visible and easy to tap
- Location permission that fails gracefully when declined
- Result cards that do not sit under the map controls
- Phone links in the location details and directions that open Google Maps
- No horizontal page scrolling
Connect It to Shopify Pickup
Shopify owns the checkout and pickup workflow. The locator's job is to help shoppers find a relevant place before they reach it.
Add a Pickup available filter to locations that support collection, and link the locator from the storefront navigation or pickup information page. Keep the actual stock status and checkout eligibility inside Shopify so the customer sees the same availability at every step.
Understand What Each StoreRocket Plan Adds
| Included | Shopify locator capability |
|---|---|
| Every plan | Search, directions, hours, filters, CSV import, customization |
| Depends on the plan | Analytics, custom map styles, Google Sheets sync, lead capture, REST API, multi-language, white label, priority support, and the number of locations |
Prices and what each plan includes are on StoreRocket's current plans.
Every paid plan uses your Google Maps or Mapbox key. The map provider bills that usage separately from the StoreRocket subscription.
After Install: Locations Change in the Dashboard
Once the page is live, you add, edit or import locations in the StoreRocket dashboard and the locator on your page shows the change. StoreRocket maintains the hosted locator and delivers updates through the embed already on your site, so there is no theme code to revisit.
Set Up the Locator Page for Search
Give the page a plain title that matches what customers search for:
1Find a [Brand] Store Near You
Use a short URL such as:
1yourstore.com/pages/store-locator
Write a unique page introduction that names the countries, regions, or store types covered. The locator helps visitors search the location list; individual location pages are a separate SEO project and need useful, location-specific content rather than a city name swapped into one template.
For the broader strategy, read the store locator SEO guide.
Troubleshoot the Published Page
The Locator Does Not Appear
Check that the full snippet was pasted into a block that allows JavaScript, that the page is published, and that the account ID matches the StoreRocket install screen. Then test the published storefront rather than relying only on the theme preview.
The Map Does Not Load
Check the map key in StoreRocket, confirm that billing is enabled with the provider, and review the browser console for the exact provider error. Google Maps keys should be restricted to the storefront domains that use them.
Search Finds Nothing Nearby
Confirm that the location has a valid address and coordinates, widen the search radius, and clear any filters that may exclude it. Test with a city or postcode close to a known location.
The Page Looks Wrong on Mobile
Check the width and spacing of the Shopify section around the embed first. A fixed width or clipped parent container can break an otherwise responsive locator. Test the real theme at 390 pixels wide and make sure the document does not scroll sideways.
Measure What the Locator Is Doing
StoreRocket analytics (plan-dependent) report locator views, visitor search terms, a geographic search heatmap, and click totals by location. Depending on the plan, it also stores leads captured when a visitor searches an area with no nearby result.
Use Shopify reporting for online orders and pickup, Google Business Profile for calls and direction requests, and your site analytics for visits to the locator page. Keeping those sources separate avoids turning one click count into a claim it cannot prove.
Frequently Asked Questions
Do I need Shopify Plus?
No. The StoreRocket Shopify app and standard embed work without Shopify Plus.
Will a store locator slow down every page?
The StoreRocket script loads on the page that carries the locator. Test that published page with your production theme and the other apps it loads.
Can I show live inventory by location?
Use Shopify's inventory and local-pickup features for real-time stock. StoreRocket filters can describe product ranges or services that you maintain for each location.
Can I manage hundreds of locations?
Yes. Import the initial list as a CSV or Excel file. Depending on the plan, projects can create a StoreRocket-linked Google spreadsheet and sync it daily or on demand, or update locations through the REST API. See the Google Sheets setup guide.
Can shoppers search for a specific product?
You can create filters for product categories and assign them to locations. Keep those assignments current; they are category data, not a live inventory feed.
Do I need my own map key?
StoreRocket supplies the key during the free trial. Every paid project connects its own Google Maps or Mapbox key, and that provider bills the map usage directly.