All integrations OpenLayers React WordPress API docs

ExpressMaps for WordPress

A block and a shortcode that put an OpenStreetMap-based map on any page. No Google account, no card, no cookie banner for the map.

Install the plugin

  1. Download expressmaps.zip (version 1.0.0, GPL).
  2. In WordPress go to Plugins → Add New → Upload Plugin, choose the zip and activate.
  3. Create a free ExpressMaps account, make an API key in the console and restrict it to your domain.
  4. Paste the key into Settings → ExpressMaps and pick a default style.

Listing on the WordPress.org plugin directory is in progress; until then the zip above is the supported download.

Add a map with the block

In the editor, add the ExpressMaps Map block. The sidebar lets you set latitude, longitude, zoom, style, height, a marker and popup text, and shows a live preview while you edit.

Or use the shortcode

Works in the classic editor, widgets and page builders:

[expressmaps lat="51.5072" lng="-0.1276" zoom="13" style="standard" height="400px" marker="true" popup="Our office"]

Attributes: lat, lng, zoom (0 to 20), style (one of the ten styles), height, width, marker, popup, controls and an optional key override.

Without the plugin

A Custom HTML block works too. Paste this and replace the key:

<link href="https://unpkg.com/maplibre-gl@4.7.1/dist/maplibre-gl.css" rel="stylesheet" />
<script src="https://unpkg.com/maplibre-gl@4.7.1/dist/maplibre-gl.js"></script>
<div id="map" style="width: 100%; height: 400px;"></div>
<script>
  var map = new maplibregl.Map({
    container: 'map',
    style: 'https://tiles.expressmaps.com/styles/standard.json?key=YOUR_API_KEY',
    center: [-0.1276, 51.5072],
    zoom: 13
  });
  map.addControl(new maplibregl.NavigationControl());
  new maplibregl.Marker().setLngLat([-0.1276, 51.5072]).addTo(map);
</script>

Why not just embed Google Maps?

  • Google requires a billing account and charges after 10,000 loads a month. ExpressMaps includes 100,000 loads free, then plans from $29.
  • A Google embed sets cookies and reports visitors to Google, so EU sites need consent before the map shows. ExpressMaps tiles set no cookies.
  • An ExpressMaps map is roughly a quarter of the page weight of a Google embed, which helps Core Web Vitals.

Download the plugin Get a free API key