MapSVG Gutenberg block
The MapSVG block embeds a map in the WordPress block editor with a live preview in the canvas.
Add the block
- Edit a page or post with the block editor
- Click + (inserter) and search for
MapSVG
- Insert the
MapSVG block
- In the placeholder, choose a map from the dropdown
The map loads in the editor with a live preview.
Block settings
With the block selected, open the right sidebar (Block settings):
| Setting | Description |
|---|---|
| Map | Which MapSVG map to display |
| Selected Region ID | Optional region ID to pre-select on load (same as shortcode selected) |
| Lazy load | If enabled, the map loads when it enters the viewport on the front end only (editor always loads immediately) |
Use the toolbar Change map control to clear the selection and pick another map.
Convert from shortcode
If the page already has a Shortcode block containing [mapsvg id="…"], Gutenberg can transform it into the MapSVG block. Attributes id, selected, and lazy are carried over when present.
Front end
Publish or update the page. The front end uses the same options as the block settings (id, selected, lazy).