Google Maps ​
The Google Maps mode embeds a standard interactive 2D map. Visitors can pan, zoom, switch between map and satellite views, and interact with markers and info boxes.
How it works ​
When you select Google Maps as the map type, the plugin renders a google.maps.Map instance. The map centers on the coordinates you provide and applies any configured styles, markers, and layers.
Markers and info boxes ​
By default, a marker is placed at the map center. You can configure:
- Show/hide the marker — Toggle marker visibility
- Animation — Drop or Bounce animation when the map loads
- Info Box — A popup window attached to the marker, triggered on click or hover
- Info Box content — By default, shows the formatted address. With Pro, you can add custom HTML content (images, links, phone numbers, CTAs)
Map styles ​
The map appearance can be customized with preset themes or custom JSON styles. See Map styles for details.
Map layers ​
Overlay additional data on the map. See Layers for traffic, bicycle, and transit overlays.
Configuration ​
| Option | Description |
|---|---|
| Address | Location center. Autocomplete-enabled. |
| Zoom | 1 (world) to 20 (building level) |
| Width / Height | Container dimensions |
| Marker | Show/hide, animation type |
| Info Box | Show/hide, trigger (click/hover), open by default |
| Style | Default, Modest, Ultra Light, WY, Shades of Grey, Custom JSON (Pro) |
| Layers | Traffic, Bicycle, Transit (Pro) |
When to use Google Maps vs Street View ​
| Scenario | Best choice |
|---|---|
| Show a business location on a map | Google Maps |
| Show what the area looks like in person | Street View |
| Show both location and surroundings | Synchronized view (Pro) |
| Provide driving/walking directions context | Google Maps |
| Display interior of a business | Street View |