The Google Maps widget is a really simple way to embed Google Maps in your website. This is very useful for contact pages, so your visitors can know where you are located.
Content
- Location: Enter the location you wish to display
- Zoom: Set the zoom level of the map
- Height: Set the height of the map
Style
- CSS Filters: Adjust the image style by changing the CSS Filter scales for Blur, Brightness, Contrast, Saturation, and Hue settings.
- Transition Duration (only on Hover): Set the amount of time to transition from one filter setting to the other when hovering over the map.
Advanced
Set the Advanced options that are applicable to this widget
Tip: To remove the gap around the Google Maps widget, and have the map span the full width of the page, change the Section width from Boxed to Full Screen, and set the Columns gap of the Section from Default to No Gap.
Important: In order to use the Elementor Maps Widget, you must first create an API key and place it in Elementor > Settings > Integrations. To learn more, see this article.