Maps: OpenStreetMap or Google Maps

HappenBoard can show a map of the venue on each event page. It uses OpenStreetMap by default, which needs no account and no key. You can switch to Google Maps or to another map service.

No map is loaded from any service until you turn the map on in a block.

Before you start

• The venue needs a latitude and a longitude. See venues and coordinates.
• The map is part of the Event Venue block, usually placed once in your single event template.

Show a map on your event pages

1. Open your single event template, or an event, in the editor.
2. Select the Event Venue block.
3. In the block settings, switch on Show map.
4. Set Map height (px) and Map zoom if needed.
5. Save.

Map height (px) goes from 120 to 800 pixels, 280 by default. Map zoom goes from 1 (the whole world) to 19 (a single building), 15 by default, which shows a few streets.

The map appears only when the event’s venue has coordinates. A virtual event never shows one, because it has no place.

Choose the map provider for the whole site

1. Go to HappenBoard → Integrations.
2. On the Maps card, click Configure.
3. Choose the Default map provider and the other settings.
4. Click Save changes.

Setting	What it does	Default
Default map provider	The service that draws every map whose block uses the site default: OpenStreetMap (no API key), Google Maps (requires API key) or Custom iframe URL.	OpenStreetMap
OpenStreetMap layer	The map style for OpenStreetMap: Standard (Mapnik), CyclOSM (cycling), Transport or Humanitarian.	Standard (Mapnik)
Google Maps API key	Your Google key, needed for Google Maps.	Empty
Custom iframe URL	The address of another map service, for blocks set to Custom.	Empty

Custom iframe URL as the default needs an address in the Custom iframe URL field: HappenBoard refuses to save it without one. The next sections explain both services.

Use Google Maps

1. In the Google Cloud Console, create an API key and enable the Maps Embed API for it. Google asks for a billing account.
2. Restrict the key to the Maps Embed API and to your own domain. The key appears in your pages, and an unrestricted key could be used by someone else.
3. Paste the key in Google Maps API key.
4. Set Default map provider to Google Maps (requires API key).
5. Click Save changes.

HappenBoard refuses to save Google as the default without a key. Once saved, the key field shows as empty when you reopen the card: the key is kept, and you only type in it to replace the key.

If no key is stored, maps use OpenStreetMap instead of showing an empty frame.

Use another provider on one block

Each Event Venue block has its own Map provider setting. It is on Use site default (Integrations) unless you change it. The other choices are OpenStreetMap (no API key), Google Maps (requires API key) and Custom (site iframe URL).

Choose Custom to use another map service, such as MapTiler, Stadia or Carto, or your own map server:

1. On the Maps card, paste the service’s embed address in Custom iframe URL. Put {lat}, {lng} and {zoom} where the latitude, longitude and zoom go. The address must start with http:// or https://.
2. Click Save changes.
3. In the block settings, set Map provider to Custom (site iframe URL).

To use the service on every map instead, set Default map provider to Custom iframe URL on the Maps card and leave the blocks on the site default.

A block set to Custom with no saved address, or to Google with no saved key, shows an OpenStreetMap map instead.

What each provider receives

Each map is a frame that the visitor’s browser loads directly from the provider:

• OpenStreetMap receives the venue’s coordinates and the zoom level.
• Google Maps receives the coordinates, the zoom level and your API key.
• A custom service receives whatever its address contains.

Each provider also receives what any embedded page gets: the visitor’s IP address, browser details and the page they came from. Mention the provider in your privacy policy (see GDPR and personal data).

A venue’s own page shows its address with a View on OpenStreetMap link, or View on Google Maps when Google is the default provider. Nothing is loaded until the visitor clicks it.

With HappenBoard Pro

HappenBoard Pro adds a Map Design Studio (Pro) card to Integrations, which gives these venue maps a styled design, and a block that shows many events on one map. See Clustered map and Map Design Studio.

Next steps

• Venues: creating and setting coordinates: give your venues the location the map needs.
• Building a single event page: place the Event Venue block in your template.
• Enabling weather: the same coordinates also give the forecast.
• Clustered map and Map Design Studio: style your maps and show all your events on one map.