Pro Pro feature

Find a Café Near You

Below is a multi-location store locator for a retail and franchise brand, the kind of map that helps customers find their nearest café across the country and around the world.

Try it live

Wi-Fi
  • Yes
Drive-Thru
  • Yes
Mobile Order
  • Yes
Outdoor Seating
  • Yes
Open Late
  • Yes
Reserve Bar
  • Yes
Close
Get Directions
Directions driving travel mode
Directions walking travel mode
Directions transit travel mode
Directions bicycle travel mode
'; ';
Options hide options
Print Reset
Fetching directions...

Coffee shop icons created by mavadee

How it works

One map for every location you run

Whether you have a dozen branches or thousands of franchise outlets spread across countries, they all live on a single map. Customers search a town, postcode or full address and the map zooms straight to the locations nearest them, so a national or international footprint feels local to whoever is looking.

Let customers filter by what each store offers

Not every outlet is the same, so the filters above the map let people narrow down to exactly what they need, such as Wi-Fi, a drive-thru, mobile ordering, outdoor seating, late opening hours or a licensed bar. Each of these is a custom field on your markers, and customers tick the ones that matter to find the right store rather than just the closest one.

Keep a busy map fast and readable

When hundreds or thousands of stores sit close together, marker clustering groups nearby pins into tidy numbered icons that break apart as visitors zoom in. The map stays quick to load and easy to read, even at full national or global scale.

Built for retail chains and franchises

Import your whole store list in bulk from a spreadsheet and keep it in step with re-imports as outlets open or move. Add categories and per-store details, switch on directions so customers can route straight to the door, and drop the locator into any page with a shortcode.

For developers Copy the CSS used on this demo

Pick a feature and paste it into the Custom CSS area (Maps -> Settings -> Custom Scripts) to give your own WP Go Maps the same look.

/* WP Go Maps — custom field filter bar shown above the map.
   This is the row of "Wi-Fi / Drive-Thru / ..." filter widgets. */
.wpgmza-filter-widgets {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
  margin: 6px 0 22px;
}

.wpgmza-custom-field-filter-widget-checkboxes {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  min-width: 122px;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid #e7e7ec;
  border-radius: 12px;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.wpgmza-custom-field-filter-widget-checkboxes:hover {
  border-color: #d7d7df;
  box-shadow: 0 2px 10px rgba(20, 20, 40, .05);
}

/* Highlight a filter while its checkbox is ticked (needs :has support) */
.wpgmza-custom-field-filter-widget-checkboxes:has(input:checked) {
  border-color: #f0616d;
  background: #fdeced;
}

.wpgmza-placeholder-label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: #23252f;
  white-space: nowrap;
}

.wpgmza-checkboxes {
  list-style: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
}
.wpgmza-checkboxes li {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: #5b5e6b;
  cursor: pointer;
}
.wpgmza-checkboxes li input[type="checkbox"] {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: #f0616d;
  cursor: pointer;
}

.wpgmza-reset-custom-fields {
  display: inline-flex;
  align-items: center;
  align-self: center;
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  color: #5b5e6b;
  background: #f6f6f4;
  border: 1px solid #e7e7ec;
  border-radius: 10px;
  cursor: pointer;
}
.wpgmza-reset-custom-fields:hover {
  color: #d94552;
  border-color: #f0616d;
  background: #fdeced;
}
/* WP Go Maps — tidy custom marker fields with icon badges.
   Works in the marker info window and the marker listing. */
[data-custom-field-id] {
  display: flex;
  align-items: center;
  margin: 5px 0;
  font-size: 13px;
  line-height: 1.3;
}

i.wpgmza-custom-field {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  border-radius: 7px;
  background: #f6f6f4;       /* light badge background */
  border: 1px solid #ececef;
  color: #f0616d;            /* icon colour */
  font-size: 12px;
  line-height: 1;
}

.custom-field-label {
  font-weight: 600;
  color: #23252f;
  margin-right: 4px;
}

Pricing

Loading pricing…