elementor-google-map-widget-stratum

Stratum Widgets: Advanced Google Maps Elementor Widget

The free version of Elementor provides you with a basic Google Maps widget, but if you want to customize the map further, use the Advanced Maps Elementor widget by Stratum. It’s also free but gives you access to way more tools integrated from the official Google Maps services.

All you need to get started is to obtain your Google Maps API key:

How to get an API key for Google Maps

To use the API key associated with your project on your Elementor WordPress website, go to WordPress dashboard > Stratum > Settings > API > Google Maps API key > insert your key.

stratum google maps widget

The Purpose of the Advanced Posts Elementor Widget

This maps Elementor widget is perfect for showcasing your business address/addresses on an interactive Google map on any page, without a need to integrate third-party plugins.

Key Benefits

Unlike a native Elementor widget for adding a Google map, you can customize the widget by Stratum employing the following features:

  • Display unlimited locations on the map using custom markers (marker clustering).
  • Adjust a default map interface with regard to user interaction (zoom, fullscreen, etc.).
  • Choose a theme map style to be a better match for your Elementor WordPress theme design.

General Features & Settings of the Google Maps Elementor Widget

You can use single or multiple markers on your map.

general settings google maps

Interaction controls: Zoom and pan (dragging) settings

Select the preferable way users will interact with your Google map:

  • Enable zooming and panning
  • Completely disable zooming and panning (dragging is allowed but the map stays of the same scale)
  • Prevent unintentional zooming while scrolling a page.

You can also set up a default zoom level:

advanced google maps elementor widget zoom level

Map marker settings

It’s easy to add unlimited markers and customize their appearance:

  • Marker title
  • Marker longitude and latitude
  • Optional description
  • The pop-up window width.

map marker settings

Map controls

advanced google maps elementor maps control

  • Street view
  • Map type (allow users to toggle between the street and satellite views)
  • Zoom controls
  • Fullscreen (allow users to enter the fullscreen mode).

Remember that the default behavior is that all the map interaction controls disappear if the map is viewed on small devices (200x200px).

Map styles

advanced google maps elementor map theme

Note: Map styling can be used to prevent businesses, public transit icons or other points of interest from appearing on the map.

You can select the theme source and choose the preferable map styling:

  • Google Standard
  • Snazzy
  • Custom (add your CSS styles)

Heading over to Styles, you can configure the default map height. Using the Advanced Elementor styling settings, it’s easy to apply more motion effects, change backgrounds, adjust the spacing and configure other common styling Elementor settings.

Stratum Free Elementor Widgets: Download the Google Maps Elementor Widget

If you want to create a more tailored look for Google Maps on WordPress, this Google Maps widget for Elementor can be your go-to solution.

Feel free to get the Advanced Google Maps Elementor widget along with other awesome ones by downloading Stratum widgets for Elementor:

Stratum Free Elementor Widgets Download

If you are also working with the Gutenberg WordPress block editor, make sure to check out Getwid – our huge collection of free Gutenberg blocks.

Leave a Reply

Your email address will not be published. Required fields are marked *