New Icon Picker and Color Picker
This version includes a new color picker and icon picker controls. Both controls are now written in React, which allows for additional functionality.
The color picker now allows a setting for specifying custom colors using the WordPress color picker.
The icon picker now includes the ability to upload icon files, and to create new map icons.
Icons are created by specifying a base shape, color, and a ‘glyph’ (a smaller icon to be displayed inside the shape). A .PNG file is generated for the icon when it’s saved, which can then be used normally in maps. This allows for millions of possible icon combinations, while still retaining the performance and caching benefits of .PNG map icons.
Here’s an example of creating a new icon – a red marker with a coffee cup inside it – using the icon generator.
The MapPress settings screen has been converted to React, which will allow new functionality in future releases.
New popup templates
This version adds new popup templates. The new mashup popup is designed to allow larger featured images, which can be placed on the left, top or right of the popup. For example, this is a popup with the featured image on the right:
The map template has also been updated for consistency, although it doesn’t support featured images.
Please update any custom map popup or mashup popup templates to match the new format (and CSS classes). The default templates can be viewed and copied from the ‘default’ tab in the template editor, found on the MapPress settings screen.
A New Editor
The map editor used in the WordPress classic editor has had a major rewrite. It should now be consistent with the Map Library and Gutenberg map editors. The editor will also detect the map ID to edit if it is opened while the cursor is inside a map shortcode.
A new setting is available to open POI popups when hovering over a map marker or an item in the POI list. If a marker is clicked, the popup remains open until it is closed or another marker is clicked.
Highlight the Selected Icon
The currently selected POI can now be highlighted with a circle or a special icon. See this section in the MapPress settings:
Embeds for POI Popups
POI popups now support embeds, just like the regular WordPress editor. Paste a link into the POI editor and it is automatically replaced with the embed. A list of embed types supported by WordPress is available here. Note that not all embed types will work in a POI popup – it depends on how the media embeds itself.
Here’s a a video of embedding YouTube video in a POI:
The infobox custom popup has been improved to size and pan better than before. Styling is easier (see file mappress.css for the CSS classes), and infoboxes are now available for Leaflet as well as Google.
Attaching Maps to Posts
Mashups work by finding posts that match a query and then displaying any maps attached to those posts – it’s similar in concept to the way a featured image is attached to a post.
Until now, maps were always attached to the post where the map was originally created. Version 2.58 adds the ability to detach or attach maps from posts, allowing maps to be moved from one post to another. From the post editor, maps can be attached to the current post (or detached), and from the map library, maps can be attached to any post.
New Map Editor for WordPress Classic Editor
MapPress supports both Gutenberg and the WordPress ‘classic’ editor. For the classic editor, the MapPress map editor has been redesigned and is now accessed by clicking the ‘MapPress’ button above the post body.
Add Media to POIS
MapPress now supports inserting media into map POIs directly from the WordPress Media Library. In the map editor, open a POI to edit and use the new ‘Add media’ link to insert images, videos, etc. Note that some media types will not work properly because of the way they are inserted into the page. For example, images and YouTube videos work fine, but TikTok will not work within a map.
MapPress now fully supports the Gutenberg editor, with new blocks for maps and mashups.
Existing shortcodes will continue to work, but they must be converted to blocks in order to edit the underlying maps. To convert a post to the Gutenberg block editor, select a ‘classic block’ and choose ‘convert to blocks’ from the block menu.
Shortcodes must be on a separate line, with no adjacent text or punctuation.
Here’s an example of converting a classic block to the Gutenberg editor. The [mappress] shortcode is converted to a MapPress Map block.
If a separate shortcode block already exists, just use the ‘change block type’ button to convert it to a Map or Mashup block.
MapPress has a new map library where you can see and edit all of your mapsThe library is located under the MapPress settings.
From the library, maps can be created, edited and deleted. A button exists to copy the shortcode for any map.
Both maps and Mashups now support marker clustering. Switch this option on from the MapPress settings screen. The Leaflet version is more advanced, and also supports “spidering” (separating markers when they are very close together).
Custom Icons Upload
Custom icons can now be uploaded directly from your computer, from the MapPress settings screen.
When maps are small, they now automatically go into ‘mini’ mode if the POI list is on the left. The list is hidden, and toggle button are shown to allow the user to toggle between ‘list’ and ‘map’ views. The mini mode size can be set in the MapPress settings.
MapPress has actually always supported WPML, and all map controls and templates default to the current WPML language. But 2.56 adds new functionality to assist in copying posts to a translation.
When creating a WPML translation, there is an option to duplicate the content from the original post, overwriting the target (translation) post.
During duplication, MapPress will:
- Delete any maps in the target (translation) post
- Copy all maps from the original post to the translation post
- Update all shortcodes and Gutenberg blocks to use the new map IDs
The new maps can be edited in the translation language and will not affect the originals. This behavior can be switched off in the MapPress settings screen.