Adding a Google Map to Smart Builder

Follow

Want to show your visitors a physical map of your store location? Or showcase the location of a real estate property on an interactive map?

The Google Maps App in Smart Builder allows you to plug in an address and have a map appear directly on your landing page. 

This article will explain how to embed a Google Map into Smart Builder.

  1. Navigate to the Apps tab on the left-hand side of Smart Builder.
  2. Search and locate the Google Maps App.
  3. Click the plus button next to Google Maps to install the app.
  4. The Google Maps app will appear in the Add tab in Smart Builder.
  5. Drag and drop the Google Maps app onto your page (you can drag and drop the app anywhere you see a blue placeholder): Gif demo of a user adding the Google Maps app to their Smart Builder page.

Add an Address to your Google Map

  1. Click the Set Up an Address button. 
  2. This will launch the Map Settings:
    Google Maps settings section
  3. Within the Map Settings, customize the following:
    • Type in the address of the location.
    • If you prefer to show a satellite view of the map, toggle the Sattelite button.
  4. Click the enter button on your keyboard; the Google Map will update with your custom address and size dimensions: 
    A map of Vancouver in Smart Builder (powered by Google Maps), with a paragraph text of an address & phone number below.

Use the square boxes on either side of the map to increase or decrease its width:
Annotated image of red arrow pointing to draggable box icon next to Google Map.

Remember to Save and Publish your page when you're happy with these changes. You can also Preview your page to view the map in real-time.