Using custom styles for maps en WordPress

Azure Maps currently do not allow using custom styles for maps.

Toolset Maps allows you to easily use these custom styles when displaying maps. You can set a default map style for your site and also to select a style per map, which overwrites the default one. The following two images show examples of different styles.

Map using the «Silver» custom style

Map using the «Lost in the desert» custom style

Toolset Maps also allows you to set the map styles programmatically, using custom code.

Creating a Custom Style File

To create your custom map style, or get ready-to-use ones, you can use Google’s Styling Wizard or Snazzy Maps, for example. Details on how to use these sites is beyond the scope of this page, however, a simple online search should provide you with many tutorials. Both sites eventually present you with a generated JSON code. The following image shows how this looks like in Google’s Styling Wizard.

You need to copy this code and paste it into a text editor of your choice. Then, save the file with the .json extension, for example:

• black-and-white-map.json

Changing the Default Map Style for Your Site

Go to the Toolset → Settings page, click the Maps tab and scroll down to the Map styles section.

Use the Default map style dropdown to select a style. By default, you can select from three classic Google Maps styling: Night, Silver, and Standard. Use the Upload a different map style (JSON file) button to upload a file created through steps explained in the previous section.

Selecting a Custom Style for Specific Maps

When inserting a map into your pages or templates, you can select the style specifically for that map. Add the Map block and in the block settings look for the Map style section. You can use the dropdown menu to select one of the available styles.