Store locator

Add the section

Create a page in Shopify admin (for example Find a store), open it in the theme editor, choose Add section and pick SU: Store locator. It starts with two example Store blocks.

Choose where your locations come from

Under Locations, Locations from has two options:

• Store blocks in this section suits up to 50 locations, each edited in the theme editor.
• Metaobject entries suits larger lists (up to 250), or locations you’d rather manage in Shopify admin. See the last step.

Fill in each Store block

Select a Store block and fill in its Name, Address, Phone, Email and Website. Add a Photo if you like. Add another Store block for each location.

Type (for example Store, Dealer or Pickup point) and Tags (comma-separated, for example Showroom, Repairs) become the filters shoppers can pick from. Filters show only when your locations have at least two different types or tags between them.

Set Status to Coming soon or Temporarily closed for locations that aren’t open yet or are shut for a while.

Add opening hours

Write Opening hours one line per day or range of days, using English day names and the 24-hour clock:

Mon-Fri 09:00-18:00
Sat 10:00-16:00
Sun closed

The section uses these lines to show Open now · Closes 18:00 or Closed · Opens 10:00, based on the time on the shopper’s device. Days you leave out show no open or closed state.

Add coordinates

Paste the location’s Latitude and Longitude. In Google Maps, right-click the place to copy its coordinates. These place the pin exactly and are used for Near me.

If you leave them empty, the section tries to place the location from its address. The theme editor shows a note saying which locations it placed this way and which it couldn’t find. Shoppers don’t see this note.

Set up finding

Under Finding, choose what shoppers can use: Show search, Show Near me and Show filters by type and tag. With Near me on, set Distance in to Kilometres or Miles.

When a shopper types a place in the search box and presses Enter, locations are sorted by distance from that place.

Style the map

Under Map, choose a Layout:

• Immersive: tall map, floating list puts the list over the map. Shoppers can hide it to see the whole map.
• Split: list beside the map keeps them side by side.

Then set Map height, Map style and List position. Your theme’s colours tints the map from this section’s background color to its text color. Add a Pin logo, a small square logo or icon shown inside each pin.

Turn off Show map for a plain list. On phones, shoppers switch between List and Map.

If you ask visitors for consent

If your store asks consent before loading content from other websites, turn on Load the map only when shoppers ask. The section then shows a Show map button instead of loading the map on its own.

Or read locations from a metaobject

In Shopify admin, go to Settings → Custom data → Metaobjects and add a definition for your locations. Give it fields with these keys (you only need the ones you use, but name is required):

name, type, status, address, phone, email, website, hours, latitude, longitude, tags, image

For status, use the values open, soon or closed. tags can be a single line of text with commas or a list. Turn on storefront access for the definition so your theme can read the entries, then add one entry per location.

Back in the theme editor, set Locations from to Metaobject entries and enter the definition’s type handle in Metaobject type. The default is store_location.