How to Display Multiple Maps with Different Locations

Show a different set of locations on different pages: create groups, assign locations to them, and generate one embed code per group.

Groups let one account carry several maps. A brand with two ranges, a distributor with a page per country, a chain that wants service centres separate from shops: each gets its own map, from the same list of locations.

Step 1: Create the groups

  1. Go to Settings → Groups.
  2. Click Add group, name it, and save. Shoppers can see the name when Show groups is enabled.

Step 2: Put locations in them

  1. Open Locations and tick the locations that belong to a group.
  2. Open Actions and choose Assign/unassign group.
  3. In the dialog, choose Assign, pick the group, and confirm. The button names how many locations you are about to change.

A location can sit in more than one group, so a flagship store can appear on both the shops map and the service map.

Step 3: Generate one embed code per group

  1. Go to Settings → Installation and find the embed code section.
  2. Choose the group in the filter. The code below updates as you pick.
  3. Copy it, and repeat for each group you need.

Step 4: Paste each one where it belongs

Each code goes on its own page, the same way any embed code does: a new page with the HTML editor, or a Custom Liquid section in the theme editor. "Integrating store locator in your Shopify store: 3 methods" has both routes in full.

What to do next

  • Only need to split the same map rather than separate it? Tags give shoppers filters on one map, instead of you building several.

  • The embed filters also take a city or a set of tags, so a group is not the only way to narrow a map.

Stuck on any of this? Open the chat in the bottom right corner of the app and we will help you set it up.

Did this answer your question?
😞
😐
😁