The Google Map Element lets you display locations on your Reactive pages using the power of Google Maps. This is perfect for helping customers find your store, office, or any other important location.
Adding a Google Map to Your Page
Drag and drop the Google Map Element onto your page.
If you haven’t set up a Google Maps API key yet, the element will appear greyed out. When you click on it, you’ll see a message prompting you to add your key. Once added, the map will become fully functional.
Setting Up a Google Maps API Key
A Google Maps API key is required for the map element to work. This key allows you to search and display map data on your Reactive pages.
Here’s how to generate one:
-
Go to the Google Cloud Console.
-
Log in with your Google account.
-
Create a new project (or select an existing one).
-
In the left-hand menu, go to APIs & Services > Credentials.
-
Click Create Credentials and choose API Key.
-
Copy the generated key.
-
Back in Reactive, paste the key into the Google Maps API field when prompted.
For more details, see Google’s official guide: Get an API Key.
Adding Details to Your Map
Once your map is active, you can add a title and description to the location. This is useful for giving visitors more context, such as your business name, opening hours, or special instructions.
Related Articles
How to use the Box Element to style and structure page sections
The Box element is a flexible tool for organizing your page layout, structuring sections, and creating overlays with image or video backgrounds. Adding Boxes to Your Page Boxes are simple to use: From left sidebar menu. Drag and drop the Box element ...
How to Use the Icon Element to Add Icons to Your Page Content
Icons are a simple yet powerful way to enhance your page design. They can quickly communicate meaning, serve as visual alternatives to text, and even act as intuitive button replacements. How to Add an Icon To add an icon, drag the Icon Element from ...
Adding text with the Text Element
The Text Element allows you to add text content right into your page. The Text Element is one of the most powerful elements that Reactive has to offer. It’s one of the most used elements within Reactive! To get started, drag one onto your page. How ...
Create scrolling sections with the Slider Element
The Slider Element is a powerful tool for creating scrolling sections of content on your pages. Each slide is its own container, so you can add and customize elements freely. A common use is building image slideshows to showcase products. Slides per ...
Migrating to Google Analytics 4
In order to begin collecting data for your website, it is necessary to possess a Google Analytics account and create a Google Analytics 4 property. Following that, you can set up the Google Measurement ID on your Reactive website. This will enable ...