ThemeCanvas Locations for Elementor with OpenStreetMap

ThemeCanvas Locations for Elementor with OpenStreetMap lets you add beautiful, interactive maps to your Elementor pages using OpenStreetMap and Leaflet.js.

Add interactive OpenStreetMap maps in Elementor with the ThemeCanvas Locations widget.

This Elementor map plugin uses Leaflet.js to create fully customizable, responsive maps with unlimited location markers — no Google Maps API or tracking required.

Ideal for building store locator maps, contact maps, or multi-location layouts directly within Elementor, using fast, GDPR-compliant OpenStreetMap data.

Features

• Manual Location Entry – Add unlimited locations directly in the Elementor editor
• Custom Pin Colors – Set unique colors for each location marker or set a global default
• Map Style Themes – Choose from 4 map styles: Standard, Dark, Humanitarian, or Terrain
• Interactive Popups – Rich popup content with WYSIWYG editor and customizable max width
• Customizable Maps – Control zoom level, map height, and scroll behavior
• Style Controls – Customize popup title, link, and background colors
• Coordinate Validation – Automatic validation ensures accurate map positioning
• OpenStreetMap Integration – Step-by-step instructions to find coordinates
• Fully Responsive – Works perfectly on all devices
• No API Key Required – Unlike Google Maps, completely free to use
• GDPR Compliant – No user tracking or data collection
• Lightweight – Only loads assets when widget is used

Pro Version

Upgrade to Pro to unlock dynamic locations and advanced querying while keeping full compatibility with your existing manual maps.

• Dynamic Locations from posts and custom post types (CPTs)
• Advanced Querying with include/exclude and taxonomy filters
• Auto-Fit Bounds for clean multi-location map displays
• Per-Location Pin Colors saved in post meta
• Built-In Coordinate Metabox for faster editor workflows

How to Use

1. Install and activate the plugin
2. Edit any page with Elementor
3. Search for “ThemeCanvas Locations” widget
4. Drag it to your page
5. Click “Add Item” to create a location
6. Follow the OpenStreetMap coordinate instructions
7. Customize your map settings and styles
8. Publish!

Finding Coordinates

The widget includes step-by-step instructions:

1. Open OpenStreetMap
2. Search for your location
3. Right-click on the exact spot
4. Select “Show address”
5. Copy coordinates from the sidebar
6. Paste into the widget

Requirements

• WordPress 6.0 or higher
• Elementor 3.0.0 or higher
• PHP 7.4 or higher

Read the full description on the official page →