A full-featured interactive map widget — markers, clustering, proximity search, custom styling, and multiple provider options — for anything from a single office location to dozens (or hundreds) of markers driven by live query data.
Choosing a map provider
The Map Provider control offers two real options: OpenStreetMap (Leaflet, no key) — the default, requires zero setup or API key — and Google Maps (API key), which uses the shared key configured once in Tiger Elements → API Settings (not entered per-widget). If you select Google without a key configured, the widget shows a clear warning directly in the editor panel telling you exactly where to add one, rather than failing silently on the live page.
OpenStreetMap theming
When using OSM, choose a Theme (Tile Skin) — several are keyless (plain OpenStreetMap, CARTO) and work with zero configuration; Stadia and Thunderforest skins appear as options once their respective keys are set, for stores that want a more distinctive map look without switching to Google entirely.
Google Maps options
With Google selected, choose a Google Map Type (Roadmap, Satellite, Hybrid, Terrain) and optionally paste Google Style JSON (e.g. exported from snazzymaps.com) for a fully custom-styled roadmap.
Adding markers
Set Markers From to Manual, Dynamic, or Saved Query. Manual mode uses a Locations repeater (title, latitude/longitude — with a live place-search helper so you don’t need to look up coordinates by hand — description, popup image, and link) for a fixed, hand-curated set of pins. Dynamic mode pulls markers from a Post Type, while Saved Query mode pulls from a query built in the Tiger Query Builder (only post or relation sources can carry coordinates). Both read coordinates from configurable Latitude/Longitude Meta Key fields on each record — so a directory stored as a CPT or CCT appears on the map automatically as entries are added — with a Max Markers cap of up to 2000.
Map behavior
Set the Default Center and Default Zoom (with min/max zoom limits), a Map Language for Google labels and place-search results (keyless OpenStreetMap/CARTO raster tiles are pre-rendered and always show local/native place names regardless of this setting), toggle Hover Tooltips, Auto-Fit To Markers (frames every marker automatically), Marker Clustering (groups nearby pins, powered by Leaflet.markercluster and built to handle 1000+ pins without lag), and Canvas Rendering for smoother panning with a large marker count. Scroll-Wheel Zoom is off by default (so visitors can still scroll the page over an embedded map) and can be switched on, and a Fullscreen Button — enabled by default — lets visitors expand the map to fill the screen on either provider, no key required.
Find Near Me (proximity search)
The Find Near Me switch (on by default) adds a button, with editable Button Text, that centers the map on the visitor using browser geolocation. For Dynamic and Saved Query sources, you can also turn on Limit To Radius: after the visitor’s location is found, the server re-queries and returns only locations within a chosen Radius (km) — useful for a store-locator map where you only want the nearest few branches shown.
Location search (geocoding)
The separate Address / Place Search section adds a text box (customizable Placeholder and Button Text) where a visitor can type a business name, address, city, or place; it geocodes the query to coordinates and flies the map there, zooming to the Result Zoom level you set. The Geocoder choice mirrors the map provider logic — OpenStreetMap / Nominatim needs no key, while Google Geocoding uses the same shared API key and automatically falls back to Nominatim if no key is set. Both geocoders run server-side with caching and rate-limiting.
Styling
The Style tab covers every visible piece of the widget independently of provider: the Map Container (height, border, radius, shadow), Markers & Clusters (pin color, cluster bubble background/text color and size, plus cluster typography and border — these are wired through CSS variables consumed by the SVG pin and cluster bubble), the Find Near Me Button and Search Box (input, button, and results dropdown, each with normal/hover states), the Fullscreen Button, the marker Popup card (background, border, radius, shadow, plus color/typography controls for the title, description, link, and popup image), and the Tooltip on hover — which only applies to the Leaflet/OpenStreetMap provider, since Google Maps renders its own native tooltip.
Requirements
None for the default OpenStreetMap provider — map tiles, marker clustering, and the Nominatim geocoder all work with zero API key. A Google Maps API key (added once in Tiger Elements → API Settings, shared with the Store Locator widget) is only needed if you choose the Google provider for tiles or geocoding.
Practical tips
- Start with OpenStreetMap — it needs no setup and no ongoing API cost, and covers the vast majority of use cases; switch to Google only if you specifically need Google’s satellite imagery quality or a look your audience associates with Google Maps specifically.
- Use Dynamic markers with a Saved Query when the location list is genuinely data-driven (a store directory, a property listing) — it stays in sync automatically as records are added or removed, unlike the Manual repeater which needs hand-editing.
- If you enable Find Near Me with radius limiting on a large dataset, keep Max Markers reasonable — the radius filter runs on the server against the dynamic/query source, so a tight radius combined with a sane marker cap keeps the response fast.
- If the “Google” provider or geocoder silently behaves like OpenStreetMap, check Tiger Elements → API Settings — a missing key makes Geocoding fall back to Nominatim, and the editor panel will show a warning if the Google map provider itself has no key configured.
- Leave Scroll-Wheel Zoom off on pages where the map sits inline in a long-scrolling layout so visitors don’t get trapped zooming instead of scrolling; turn it on for maps that are the primary focus of a page.