Table of Contents

Embed Google Maps

Abby Updated by Abby

We can display any address we want with the Google Maps Embed API, whether the address is an input from the user with our Address block or we just want to display our business address.

This is what the flow will look like:

  1. If you plan on using the address block to get the user's address the first step is to set it up following these instructions.

Alternatively, if you plan on using your own address variable you just need to save it in a variable called @address(be sure you have the entire address and that the address is accurate).

  1. The next step is to activate the Google Maps Embed API

How to get the API key

  1. After we've got our API key we need to enter it in a 'Set Variable' called 'googlemapsapikey'. It's very important to write the variable name exactly as it's written here:

  1. We'll then create another 'Set Variable' called 'embedmapsnippet' with the following code:

<iframe width="600" height="450" frameborder="0" style="border:0" src="https://www.google.com/maps/embed/v1/place?key=@googlemapsapikey&q=@address" allowfullscreen></iframe>

  1. Last step! We'll add a 'Send Message' block with the variable 'embedmapsnippet' that will display our address:

Here's how it will look:

Channel Type compatibility

for Web

This feature is fully compatible.

for Whatsapp

This feature is not compatible with Whatsapp.

for Messenger

This feature is not compatible with Messenger.

How did we do?

Google Maps API Key for Address block

Contact