Home / / Map type: Open Street or Google Maps

Map type: Open Street or Google Maps

6749 views

WPResidence supports two map systems: OpenStreetMap and Google Maps.

The map system is selected from:

Theme Options → Map Configuration → Map General Settings

From this section, you can choose the map provider, add the required API keys, set the default map starting point, manage zoom, enable pin clusters, and control map settings used across the website.

Content

Choose the Map System

Go to:

Theme Options → Map Configuration → Map General Settings

Use the map system option to select the provider used by the theme:

  • OpenStreetMap
  • Google Maps

The selected map system applies to WPResidence maps across the website, including property maps, map hero headers, map widgets, map shortcodes, the map item in the Property Overview section, and the map included in Print.

Important: OpenStreetMap and Google Maps use different API settings. Choose the map system first, then add the API key required for that map system.

Use OpenStreetMap

OpenStreetMap can be used without a Google Maps API key.

To set OpenStreetMap as the map system:

  1. Go to Theme Options → Map Configuration → Map General Settings.
  2. Select OpenStreetMap as the map system.
  3. Save the changes.
  4. Clear cache and test the map on the frontend.

MapBox API Key for OpenStreetMap

MapBox is used only when the selected map system is OpenStreetMap.

MapBox is not the same as Google Maps. It does not replace the Google Maps API key. It is used for OpenStreetMap map tiles and map images.

You can get a MapBox API key from:

MapBox

Important: Use a MapBox API key only with OpenStreetMap. If you select Google Maps, use a Google Maps API key instead.

Map Images for Overview and Print

New: The Map item in the Property Overview section works with both map systems supported by WPResidence.

The map is also included in Print and behaves like the Overview map.

For these map images to display correctly, the correct provider setup is required:

  • OpenStreetMap: a valid MapBox API key is needed for the Overview map image and the Print map image.
  • Google Maps: a valid Google Maps API key is needed, and the Google Maps Static API must be enabled in the Google Cloud project used for that key.

The property must also have a saved location and valid latitude / longitude coordinates.

The Property Overview map item is managed from:

Theme Options → Property Page → Overview section → Arrange Overview Details

Enable the Map item if you want the small map image to appear in the Overview section.

How to manage the Property Overview map

Print PDF Management

Important: If OpenStreetMap is selected and the Overview or Print map image does not show, check the MapBox API key. If Google Maps is selected and the Overview or Print map image does not show, check the Google Maps API key and confirm that the Google Maps Static API is enabled.

OpenStreetMap Limitations

OpenStreetMap does not support all Google Maps features.

These options are not available with OpenStreetMap:

  • Google Street View
  • Google Places options used on the property page map
Important: If you need Google Places, Google Street View, or other Google-specific map features, use Google Maps and configure the Google Maps API key.

OpenStreetMap Language

Changing the OpenStreetMap tile language is not a theme option.

This requires custom code changes in the map scripts and depends on the tile provider used. Because this is a code customization, it is outside the standard theme options setup.

Use Google Maps

To use Google Maps, select Google Maps as the map system and add your own Google Maps API key.

Go to:

Theme Options → Map Configuration → Map General Settings

Then:

  1. Select Google Maps as the map system.
  2. Add your Google Maps API key.
  3. Save the changes.
  4. Clear cache and test the map on the frontend.

Google Maps API Key

Google Maps requires your own Google Maps API key.

The API key is added in:

Theme Options → Map Configuration → Map General Settings

Google Maps will not work correctly if the API key is missing, invalid, restricted incorrectly, or if the required Google APIs are not enabled.

When creating the Google Maps API key, make sure your Google Cloud project is configured correctly:

  • Billing is enabled in Google Cloud.
  • The required Google Maps APIs are enabled.
  • The API key is restricted to your website domain.
  • The domain restriction includes the correct website URL format.

Google Maps – How to add Google API Key

Important: If Google Maps does not load, check the browser console on the frontend page. Google usually shows the exact API error there.

Google Maps Static API

The Google Maps Static API is required when Google Maps is used for map images generated by WPResidence.

This applies to:

  • The Map item in the Property Overview section
  • The Map included in Print

If Google Maps is selected and these map images do not show, check the Google Cloud project used by your API key and enable the Google Maps Static API.

Important: The Google Maps Static API is enabled in Google Cloud. It is not a separate WPResidence setting.

Google Maps Extra Settings

After Google Maps is selected and the API key is added, you can manage extra Google Maps display options from:

Theme Options → Map Configuration → Google Maps Extra Settings

These settings can control options such as:

  • Default Google Maps view
  • Google Maps pin cache
  • Google Maps search over the map
  • Custom Google Maps style JSON

Google Maps Extra Settings

Important: Google Maps Extra Settings do not replace the main Google Maps API setup. Add the API key first in Map General Settings, then use Extra Settings only for display and behavior options.

Disable Maps for the Entire Website

If you do not want to use maps on the website, maps can be disabled from the theme settings.

How to disable maps for the entire website