Skip to main content

Design and assign markers with the Marker editor

Store Locator → Markers contains reusable icon-marker records. These are different from Builder → Map marker designs: a Marker record is an SVG pin, while a Map marker design is an HTML mini-card.

Create a marker from the library

  1. Open Store Locator → Markers → Add New.
  2. Enter a recognizable Name, such as Restaurant — purple pin.
  3. In Marker Design, leave Build from library selected.
  4. Use the Pin, Badge, and Icon tabs to build the marker.
  5. Leave Active enabled and save.

The preview changes immediately. Editing an existing library-built marker restores its saved editor controls instead of flattening it into an uneditable image.

Pin controls

ControlWhat it changes
ShapeOuter marker silhouette from the bundled shape gallery
SizeRendered pin width, 16–64 px; height follows the 32×44 marker ratio
Fill colorMain pin body color
Stroke colorOptional outline around the pin shape
Stroke widthOutline thickness from 0–6; 0 removes the outline

Badge controls

The badge is the circle behind the glyph. Set Badge color independently from the pin and set Badge size from 0–13. A size of 0 removes the circle, which is useful for a glyph directly on the pin.

Icon controls

Search the bundled glyph library by names such as shop, hospital, fuel, cafe, or airport. Icon color changes the glyph only. Icon size scales it from hidden (0) to 1.6, and Icon stroke width changes the glyph's line thickness from 1–5 without changing the pin outline.

Upload your own SVG

  1. Switch Marker Design → Upload SVG.
  2. Select an .svg file no larger than 100 KB.
  3. Wait for the uploaded preview, then save the Marker record.

The plugin sanitizes uploaded SVG markup and strips scripts and event handlers. An uploaded SVG is used as supplied and does not expose the library Pin/Badge/Icon controls. Use Replace SVG to change it.

Understand marker resolution

For an Icon-mode Map, the effective marker is resolved in this order:

  1. the Map widget's Override markers selection;
  2. the Store's explicit Icon Marker;
  3. the Store's Category marker when the Store uses Inherit from category;
  4. Settings → Defaults → Global icon marker.

An override on one Map intentionally makes every Store use the same marker. Leave it disabled when Stores or Categories must have different pins.

Assign by Store or Category

For one location, edit the Store and open Location → Map Marker. Choose the saved Icon Marker or select Inherit from category.

For a whole group, edit Store Locator → Categories, choose its Icon Marker, then set the relevant Stores to inherit. If a Store belongs to several Categories with markers, avoid depending on category order; assign the marker directly when the visual identity must be deterministic.

Icon markers versus HTML markers

The Layout's Map → Marker type decides which system is active:

  • Icon uses Marker records from this page;
  • HTML card uses Builder → Map marker designs;
  • changing to HTML card mode does not convert or delete icon assignments.

Activation and migration behavior

Bundled markers are imported idempotently. Deactivate/reactivate does not create another copy of every bundled marker. Built-in marker URLs are rebased to the current plugin directory after a domain migration or folder rename; uploaded custom SVG URLs remain Media Library URLs.

If a pin is invisible, confirm the Marker is active, its image URL returns 200, the Map uses Icon mode, and no Map-widget override is replacing it.