Map is a widget that allows you to embed an interactive map to a web page. A map can be embedded using Google Maps or Yandex Maps APIs.
In page editing mode, the widget looks like a stub block. The map is displayed only in preview mode or on the published site.
For correct map display, you need to add an API key in the Project settings in the Dashboard.
To add a key:
Go to the Project settings via the Top bar menu
Open the Integrations tab
Add an API key in the Google Maps or Yandex Maps section.
For details about API keys, see: Google and Yandex Maps.
You can customize a map using the options on the Settings tab in the right panel.
Here, you will see a warning that you need an API key to work with maps. Also, you can follow the link to the project settings to add the key.
The following options are available in the settings:
- Type of a map: Yandex or Google.
- Map scale: zoom factor, specified as an integer from 1 to 21 (where 1 is minimum and 21 is maximum). The default map scale value is 18.
- Language used on a map: Russian or English.
- Center coordinates means longitude and latitude (in degrees) separated by commas.
- Points on the map: you can add points of any objects on the map by specifying their name, description, and position. To do this, click on “+” and enter the required data.
You can add several points, edit, copy, and delete them.
By default, the map widget has a height of 300px. You can change the styles of the element on the Styles tab in the right panel by specifying the desired size and position.
To view a map, go to the page preview or publish your project and open the published site.