> For the complete documentation index, see [llms.txt](https://foxecom.gitbook.io/zest-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://foxecom.gitbook.io/zest-theme/theme-sections/map.md).

# Map

<figure><img src="/files/F8GdTUSZQV8FwGVW8e2I" alt="An example of a map section in Zest theme"><figcaption></figcaption></figure>

Showcase your store's location with a live Google Map, store info, and a call-to-action button. It’s especially helpful for brick-and-mortar stores that want to build trust and make it easy for customers to find them.

## How to add a Map section to your Shopify store

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Map.**
3. Make necessary changes.
4. **Save.**
   {% endhint %}

## How to edit a Map section

### Section settings

<table><thead><tr><th width="220">Setting</th><th>Description</th><th data-hidden></th></tr></thead><tbody><tr><td>Address</td><td>Input the physical location of your store.</td><td></td></tr><tr><td>Google Maps API key</td><td>Required for the map to display. See <a href="https://developers.google.com/maps/documentation/javascript/get-api-key">register a Google Maps API key</a>.</td><td></td></tr><tr><td>Banner</td><td>Optional image shown if map doesn't load.</td><td></td></tr><tr><td>Map style</td><td>Choose from default, silver, retro, dark, night, aubergine.</td><td></td></tr><tr><td>Map height</td><td>Adjust the map height in pixels.</td><td></td></tr><tr><td>Zoom</td><td>Adjust zoom level. Higher values shows a closer view.</td><td></td></tr><tr><td>Draggable</td><td>Allow users to drag and explore the map.</td><td></td></tr><tr><td>Scroll wheel</td><td>Enable zooming with mouse scroll. Only works if draggable is on.</td><td></td></tr></tbody></table>

{% hint style="warning" %}
Without a valid Google Maps API key, the map will not appear. A fallback banner image is highly recommended in such cases.
{% endhint %}

### Block settings

Now that you have a basic map of the store's location, you can choose to display additional information within the box, including:

* Heading
* Text
* Button
* Social links.&#x20;

{% hint style="info" %}
Add your social links in Theme settings > [Social media](/zest-theme/theme-settings/social-media.md)
{% endhint %}