Store Locator on OpenStreetMap

If you need to show all of your stores, resellers, or offices on a map, check the guide on how to use leadstreet's HubSpot custom module for a store or dealer locator on OpenStreetMap - a wiki map of the world.

You can use OpenStreetMap to show stores by adding their locations with various shop tags, such as shop=supermarket or shop=department_store, to the map's data. Doing this helps you boost the visibility of your businesses. Customers can find your branches more easily, too.

Our OpenStreetMap Store Locator can list all your branches for you. Just provide the store details in the fields of the module. No API needed. Access it here.

How do you set up this HubSpot custom module?

To properly install the Store Locator on OpenStreetMap, you can: 

1. Add leadstreet’s HubSpot custom module to a website page or landing page. 
2. Add all your stores to the module with names, addresses, images, geolocation, opening hours, etc. Alternatively, you can add your services through JSON code or a JSON link.

3. Easy setup. NO API needed!

What are the options?

• Custom text field for title, subtitle and content, with full formatting options.
• Add customizable filter options with your own title text and a dropdown of categories displayed right above the map.
• Enjoy flexible map settings — adjust module width, center your map automatically or by coordinates, define zoom level, customize default and active markers, and choose between a colored or grey style.
• Flexible display options let you showcase your stores, campuses, or services with pop-ups highlighting details and images, or place the location list at the top, bottom, left, or right of the map.
• Choose whether to display a title above the location list to guide your visitors.
• Selecting a service or location from the list automatically highlights its marker on the map.
• Add all your stores manually to the module with their names, addresses, images, geolocations, opening hours, etc. You can also choose to add them through JSON code or a JSON link.
• Easily include JSON-LD structured data so search engines and AI bots recognize your stores’ addresses, contact details, and opening times.

Manage your locations

Manage your location sources manually or by using JSON, a built-in option of the Store Locator on OpenStreetMap HubSpot custom module. Choose your location source: Manually, by JSON code or JSON link.

Add your location sources manually

1. Fill out the following details per store or office:
   1. name
   2. address
   3. latitude
   4. longitude
   5. website
   6. description (for example, opening hours)
   7. image
   8. custom icon marker
   9. custom icon marker active
   10. categories
2. Enable the option to pop up that particular location on your map, if you prefer.
3. Apply your changes, and you are all set!

Using JSON code

1. First, convert your XLSX to JSON output.
   1. Create an XLSX with all your locations. Find an XLSX demo here.
   2. Use this link to convert your XLSX to JSON.
   3. Update the category in JSON.
      1. Open the JSON in a notepad (Notepad++ on Windows or Sublimetext on Mac).
      2. Add [ ] brackets around the category on each category line.
         
      3. Copy the updated JSON and add it to the Store Locator on OpenStreetMap HubSpot custom module.
2. Choose Location source JSON.
3. Paste the updated JSON code (from ii).
4. Update your webpage.

Using JSON link

1. Create your JSON output.
2. Save the JSON code in a file on your HubSpot Files.
3. Paste the URL of that file into the OpenStreetMap Store Locator HubSpot custom module.

Too many stores or services to add?

Do you have a large number of stores or services?
For a one-time setup fee, leadstreet can integrate the custom module to HubDB.

Any questions? 

Please contact our support team via this form