This section can be applied to all of the theme's templates.
The Map section provides a simple way to show customers your physical location using Mapbox.
Customize section settings
Click the Map section to open its general settings.
Layout on desktop determines whether the map appears on the left or right side of the text box on desktop. On mobile, the text box is above the map.
Use the Heading field to add a title for the section. Adjust the text size with the Heading size, and set its alignment to left, right, or center with the Heading position.
Within the Address and hours text box, you can add your store’s physical address and operating hours.
Map address: Enter your store's address that Mapbox will use to display on the map.
Mapbox API access token: Enter the API access token from your Mapbox account. You'll need to register a Mapbox API access token to display the map.
Mapbox style URL: Customize your map’s appearance by adding a Mapbox style URL. Learn more.
Show 'Get directions' toggle: Adds a Get directions button that opens the map in a new browser tab.
Image: Select an image to display in this section if you prefer not to use the Mapbox API.
Set up your Mapbox API access token
Vino leverages Mapbox to deliver a faster, more efficient Map section. To activate the map, you’ll need to create a Mapbox API access token and add it to the Map section settings.
Register the access token
Navigate to the Mapbox access tokens page.
Choose Create a token.
Add a name for the token in the Name field.
Verify the default Public scopes are enabled.
For better security, restrict API access to your store only.
Click Create token.
Add your access token to the map section
- In your Shopify admin, find the Vino theme and click Customize.
- Locate the Map section and click on it.
- In the Mapbox API access token field, paste your Mapbox API access token.
- Click Save.
Restrict API access to only your store
To protect your API token, Mapbox lets you restrict it to approved domains. This ensures your map can only load on your store’s URLs.
- Navigate to the Mapbox access tokens page.
- Select the API access token you created to open its settings.
- Under URLs, enter all of your store’s domains, including the default Shopify domain (*.myshopify.com).
- Click Save.