How to add a Map section

Edited

The map section offers an easy way to point customers to a physical location on a map by leveraging Google maps and your Google Maps API key. This can be added to your homepage or on the contact page along with the contact details.

Step 1: Sign in to Your Shopify Admin

  • Go to your Shopify admin panel and sign in.

Step 2: Access the Theme Editor

  • From your Shopify admin, click on "Online Store" in the left-hand sidebar.

  • Choose Themes.

Step 3: Choose Your Theme

  • In the Themes section, select the theme you want to edit or customize.

Step 4: Edit Theme

  • Click the Customize button to open the Theme Editor.

Step 5: Add a New Section

  • In the Theme Editor, go to the page you would like to add the map and look for the Sections tab on the left sidebar.

Step 6: Configure the Map Section

  • Customize the map section settings as per your preferences. This may include setting the map's address, and other visual options.

Step 7: Add an API Key

For Impulse, Motion and Streamline Themes, follow the Google Maps instructions below.

  • Impulse, Motion and Streamline require a Google Maps API key. Please see Shopify's guide on how to generate an API key: Register a Google API key. Be sure to add the correct store URL while setting up your API key to avoid errors.

For Expanse, Fetch and Gem Themes, Follow the Mapbox instructions below.

  • Expanse, Fetch and Gem require a Mapbox API token. please see our guide on how to generate an API access token: Register a Mapbox API access tokenBe sure to add the correct store URL while setting up your API access token to avoid errors.

Step 8: Save and Publish

  • After configuring your map section and adding the API key, click Save or Publish to make the changes live on your Shopify store.

Note: If you don't have an API key or you don't want to set up one just yet, you can manually upload an image of the map and use that instead of the Google or Mapbox map.

Was this article helpful?

Sorry about that! Care to tell us more?

Thanks for the feedback!

There was an issue submitting your feedback
Please check your connection and try again.