Map

This section displays a Google map with your store's location information to help your customers find your location more easily.

To add this section, please follow the below steps:

  1. From your Shopify admin, go to Online Store -> Themes.

  2. Find the theme that you want to edit, and then click Customize.

  3. Click Add section and choose "Map".

Section settings

Setting
Description

Heading

The title for this section.

Heading size

The size of the heading text:

  • Small

  • Medium

  • Large

  • Extra large

Heading alignment

The alignment of the heading text and description within the section container:

  • Left - Aligns the heading and description to the left.

  • Center (default) - Aligns the heading and description in the center.

  • Right - Aligns the heading and description to the right.

Description

The description for this section.

Content

Setting
Description

Color scheme

Set the color for this content container.

Address and hours

Add your store's location information here.

Primary button

Setting
Description

Primary button label

The text that displays on the primary button.

Primary button link

The URL that you want the primary button to link to.

Primary button style

Style of the primary button:

  • Filled

  • Text link

  • Outlined

Secondary button

Setting
Description

Secondary button label

The text that displays on the secondary button.

Secondary button link

The URL that you want the secondary button to link to.

Secondary button style

Style of the secondary button:

  • Filled

  • Text link

  • Outlined

Background

Setting
Description

Embed a map

You need to go to Google Maps to get the HTML embed code.

Image

Add a background image if the Embed a map setting is blank.

Desktop height

Determines the height of the map on desktop:

  • Adapt to image (default) - Uses the aspect ratio of the images. This prevents the images from being cropped.

  • Small

  • Medium

  • Large

Desktop content position

Sets the alignment of the content on desktop:

  • Left - Aligns the content to the left.

  • Center - Aligns the content to the center.

  • Right - Aligns the content to the right.

Section padding

Setting
Description

Top padding

Determines the height of the top inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).

Bottom padding

Determines the height of the bottom inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).

Last updated