web_gmap Shortcode
The web_gmap shortcode renders the advanced map component.
The attributes below match the current Page Builder controls and public output. Use raw syntax only for reviewed content that cannot be maintained through the visual controls.
Allowed child shortcodes: web_gmap_marker, web_gmap_route, web_gmap_dynamic_route.
Usage
[web_gmap]
Content
[/web_gmap]Attributes
| Attribute | Default | Accepted values | Purpose |
|---|---|---|---|
height |
300px |
String unless stated otherwise | Enter the number with its unit (e.g., 300px, 20%, 100vh, etc.). |
center_based_on_markers |
calculate |
custom, calculate |
Set a custom center or calculate automatically with the average of all markers' latitude and longitude. |
center_lat |
— | String unless stated otherwise | Controls the map center default latitude. Available when center_based_on_markers is custom. |
center_long |
— | String unless stated otherwise | Controls the map center default longitude. Available when center_based_on_markers is custom. |
zoom_level |
12 |
fit, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20 |
The lower the number, the more it will cover. |
zoom_control |
yes |
yes |
Controls the zoom control. |
map_type_control |
yes |
yes |
Controls the map type control. |
street_view_control |
— | yes |
Controls the street view control. |
full_screen_control |
— | yes |
Controls the full-screen control. |
custom_style_name |
Map |
String unless stated otherwise | Controls the custom style name. |
json_map_styles |
— | String unless stated otherwise | Enter the JSON string for your custom styles. You can visit Snazzy Maps to get them. |
device_visibility |
— | String unless stated otherwise | Applies the selected responsive visibility rule. |
el_class |
— | String unless stated otherwise | If you wish to style a particular content element differently, then use this field to add a class name and then refer to it in your CSS file. |
Enclosed content
Content between the opening and closing tags is processed as WordPress shortcode content. Keep the parent/child structure shown by the visual builder so nested components receive the context they expect.
Google Maps requirement
Configure Google Maps under Settings → POM Theme → Integrations → Google Maps before using this component.
Verification
Populate web_gmap with map marker or route child shortcodes and confirm every child remains reachable in the intended order. Pay particular attention to height and center_based_on_markers.