How to Embed OpenStreetMap on Your Shopify Store with EmbedAny

Embed OpenStreetMap on Shopify: The Simple Way

Want to show your shop location, delivery areas, or create a store locator on your Shopify store? OpenStreetMap is a fantastic free mapping service that can help you do just that. This guide will show you how to add interactive OpenStreetMap maps to your Shopify store in seconds using EmbedAny.

Why Add OpenStreetMap to Your Shopify Store?

  • Show your physical store location to customers
  • Highlight delivery zones or service areas
  • Create interactive maps for events or meet-ups
  • Display multiple shop locations if you have several branches
  • Help customers find you more easily

Step 1: Install EmbedAny on Your Shopify Store

Before you can embed OpenStreetMap, you’ll need to install the EmbedAny app:

  1. Visit EmbedAny on the Shopify App Store
  2. Click “Add app” to install it on your store
  3. Follow the setup instructions to activate the app
  1. Go to OpenStreetMap.org
  2. Navigate to your desired location on the map
  3. Click the “Share” button (usually on the right-hand panel)
  4. Copy the link provided - this is what you’ll embed

Step 3: Add the OpenStreetMap to Your Shopify Store

Now for the magic part:

  1. Go to the page or product where you want to show the map
  2. In the editor, paste your OpenStreetMap link
  3. Important: Make the link italic by selecting it and using the italic button or keyboard shortcut
  4. Save your changes

That’s it! Your OpenStreetMap will now appear as an interactive map rather than just a text link.

Where to Use OpenStreetMap on Your Shopify Store

  • About Us page: Show where your business is located
  • Contact page: Help customers find your physical shop
  • Product pages: Display where products are made or sourced
  • Delivery information: Illustrate shipping zones or collection points
  • Blog posts: Add maps for location-based content

Advanced Tips

  • You can adjust the zoom level of your map by changing it on OpenStreetMap before copying the link
  • Add markers to your map on OpenStreetMap to highlight specific locations
  • Consider adding a brief description near your map to explain what customers are looking at

Troubleshooting

If your map isn’t appearing correctly:

  • Make sure you’ve properly italicised the link
  • Check that EmbedAny is activated on your store
  • Try refreshing your page cache
  • Ensure the OpenStreetMap link is complete and correct

With EmbedAny, you can make your Shopify store more informative and helpful by adding interactive maps - no coding required!