> For the complete documentation index, see [llms.txt](https://wpmaps-docs.mapster.me/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wpmaps-docs.mapster.me/mapster-wp-maps-v2/the-mapmaker/interface-overview.md).

# Interface Overview

The Mapmaker is the visual editor you use to build and configure your maps. You can open it from your WordPress admin by going to **Maps** and clicking any map, or **Add New** to create one.

\[SCREENSHOT: Full Mapmaker interface with labeled areas]

## The Layout

The Mapmaker is divided into five areas:

### Top Bar

The top bar runs across the full width of the editor and gives you access to navigation actions:

* **WP Admin** — returns you to the WordPress admin dashboard
* **View Live** — opens your map's public page in a new tab
* **Use Classic Editor** — switches to the legacy post-based editor if you prefer it
* **Map title** — displayed in the center; click to rename your map
* **Save** — saves all changes. The button is only active when you have unsaved changes; when everything is saved it shows a checkmark instead
* **\[]** (Shortcode) — copies your map's embed shortcode to the clipboard
* **Undo / Redo** — steps back or forward through your editing history
* **Mobile / Desktop toggle** — switches the map preview between a desktop and mobile viewport so you can check how your map will look on smaller screens
* **?** — opens the help panel with contextual documentation

### Left Panel

The left panel has two sections:

* **Features** — lists all the points, lines, and polygons on your map. Click any feature to select it and edit it in the right panel. Use the **+** button to add new features, or switch to drawing mode to place them directly on the map.
* **Controls** — lists all the controls added to your map (search, zoom, geocoder, etc.). Click any control to edit its settings in the right panel.

### Map Preview (Center)

The live map preview updates in real time as you make changes. You can pan and zoom it just like any map.

When you're in **drawing mode** (after clicking Add Point, Add Line, or Add Polygon), a small floating toolbar appears at the top of the map. Click the appropriate icon to draw your feature directly on the map, or use the upload icon to import a file.

### Right Panel

The right panel is context-sensitive — it changes based on what you have selected:

* **Nothing selected** — shows a welcome screen with quick-start actions
* **Feature selected** — shows that feature's style, popup, and position settings
* **Control selected** — shows that control's configuration options

### Map Settings (Bottom Panel)

The **Map Settings** drawer slides in from the right and contains your map's global configuration — style, initial view, layout/dimensions, interactivity options, specialty features, loading behavior, and developer settings. Open it by clicking the palette icon in the right panel welcome screen, or the settings icon in the top bar.

<figure><img src="/files/MTLbNQRgxF52nhK80kIO" alt=""><figcaption></figcaption></figure>

## Saving Your Work

Changes are not auto-saved. The **Save** button in the top bar will highlight whenever you have unsaved changes. The Mapmaker will also warn you if you try to navigate away with unsaved changes.

> **Tip:** Use Undo / Redo freely while editing — your history is preserved until you save or reload the page.