Blum Map

Theme: Blum · Section type: All-template section

The Map section shows a Google map of your store's location next to your store details, with a button that opens directions in Google Maps. Use it on your Contact or About page to help customers visit you.

Note: You can add this section to any template, but not to the header or footer. Each section holds 1 Content block.

Map section with store details and a Google map

What you can do

Add the section and your address
Add your store details and directions button
Show an image instead of the map
See what customers see
Look up every setting
Fix common problems

Add the section and your address

In the theme editor, open the template where you want the section.
In the left sidebar, click Add section > Map. The section comes with 1 Content block.
Under General, enter your store's Address. Google Maps loads this location.
Optional: select a Color scheme.
Click Save.

Tip: Enter the full address, including the city and country, so Google Maps finds the right place.

Add your store details and directions button

Click the Content block.
Under Text, enter a Subheading, a Heading, and a Description, for example your opening hours.
Under Button, enter the button Label, for example "Get direction".
Click Save.
Optional: click the Map section. Under Layout, select a Content ordering on desktop: Text first or Map first.

Note: The directions button shows only when the Address in the section is filled in.

Show an image instead of the map

Click the Map section.
Under General, select an Image.
Click Save.

The image replaces the Google map. The directions button still opens your address in Google Maps.

What customers see

Desktop: the store details and the map sit side by side. Text first puts the details on the left, and Map first puts the map on the left.
Map: an interactive Google map of the address. Customers can zoom, move the map, or open it in Google Maps.
Directions button: opens your address in Google Maps in a new tab.
Mobile: the store details show first, and the map shows below them.
Without the Content block: the map uses the full width of the section.

Map section on a phone with the details above the map

Settings reference

General

Setting	What it does
Color scheme	Sets the colors of the section. You can edit color schemes in Theme settings > Colors.
Address	The location Google Maps shows. It is also used by the directions button.
Image	Shows an image instead of the Google map.

Layout

Setting	What it does
Content ordering on desktop	Places the store details first (Text first) or the map first (Map first) on desktop.
Remove padding top	Removes the space above the section.
Remove padding bottom	Removes the space below the section.

Content block settings

Setting	What it does
Subheading	Small text above the heading.
Heading	The main heading, for example your store name.
Description	Text about your store, such as the address and opening hours.
Label	The text of the directions button. Leave it empty to hide the button.

Troubleshooting

The map shows the wrong place.
Enter a more complete Address, including the street, city, and country.

The directions button doesn't show.
Fill in the Address in the section settings and the button Label in the Content block. The button needs both.

I see an image instead of the map.
The Image setting replaces the map. Remove the image to show the map. If both the Address and the Image are empty, the section shows a placeholder image.

Map first doesn't work on my phone.
Content ordering on desktop only works on desktop. On mobile, the store details always show first.

Updated on: 26/10/2026

Was this article helpful?

Thank you!