Version 1.4

  • Native Directions API Integration
  • Route Optimization integration

Version 1.3 (Upcoming)

  • Geolocation option (adds a “show my location” button)
  • Bugfix for mobile— opening infowindows for each marker
  • Infowindow toggle button option — makes an AJAX call to the Airtable API. The request toggles a checkbox field in Airtable. Conditional fields can be used based on that checkbox field, e.g. the marker icon or other infowindow content. Use AJAX to update the marker/infowindow content and appearance.

Version 1.2 (Current)

InfoWindow customization for each map post, with Airtable field merge tags

Added a metabox with CodeMirror6 HTML and CSS editors to create a template for the map’s infowindows.

Added a row repeater field to create custom merge tags to pull any data from Airtable to include in the info window template. Those custom merge tags (along with default merge tags for address data) are automatically added to a drop-down menu to insert the merge tag into the HTML editor.

Also added a drop-down menu to the template’s CSS editor to add color tags (using the theme colors entered on the settings page).

Access Manager

Restrict or grant access to the custom map post based on individual user or user role

Version 1.1

Toggle Markers & KML Layer Options

The ability to use/ not use map markers (set with Airtable data) or a KML layer (e.g. a boundary overlay).

Map Uploads Metabox

Advanced fields for file uploads — Simple upload field for a KML file, and a repeater field (to add rows for additional files) for marker icon files.

Added AJAX functionality and mutation observers for users to update marker icon settings (height/width), and the page updates the icon preview size as well as the “Scaled Size:” line to display the setting values.

Custom Modals for Instructions buttons

Added “Instructions” buttons to each field (or field section) on the edit post page, opening modals with a detailed explanation of each setting or section.

Custom Styles Editor

For each website to have the maps match the theme’s color scheme, a custom CodeMirror6 instance was added to the settings page for the JSON to set the map styles object.

“Map Color Settings” section added— Fields to enter the website’s theme color hex values and color preview swatches. Those colors are then used to generate the default JSON schema for the map styles. The JSON code can be edited

Added a custom button to copy the syntax-validated and formatted JSON code from the CodeMirror editor field to import into a map theme editor like SnazzyMaps.

Also added a button to restore the original default JSON generated with the custom color settings.

Code Editor Guide

Added accordion-style elements to list all keyboard shortcuts relating to the CodeMirror6 editor, for both Mac and PC users. Also additional info about the copy/ restore defaults buttons.

Version 1.0

Custom Post Type for Maps

Registers a new custom post type (ddd_map) for creating and managing custom maps.

Custom Maps Settings Page

Added a settings page with fields for an Airtable Personal Access Token, Google Maps API key, Google Maps Geocoding API key for server-side requests.

Displays maps using the Google Maps JavaScript API

Google Maps API key is configurable via the plugin settings page.

Fetches location data from an Airtable base

Added meta boxes to map post edit post page for integration with Airtable— i.e. Airtable Base ID, Table ID, View ID. To display markers on the map, fields to configure Airtable field IDs were added for address fields, coordinates, and marker icon title.

Update Coordinates Metabox

Added a button to initiate a function that retrieves all Airtable records and uses address data to get longitude and latitude coordinates with the Geocoding API. Following a successful GET request, fields are updated in the Airtable records with the coordinates. This is an AJAX-based implementation, displaying server response alerts to the edit post page metabox.

UI enhancement– added spinner indicators for long-running tasks like updating multiple records in Airtable.

Optional Settings Metabox

Fields to optionally enter default map center coordinates, zoom level, and map height/ width were added.

Shortcode Metabox

The shortcode.php file includes everything to build and display the map, including the localization of data for use in the map’s javascript file. A shortcode, like [ddd_map id=”post_id”], is generated to embed the custom map on any post or page. Also added the option to edit the map’s height and width using shortcode attributes.

The shortcode is automatically added to the custom map post to preview the map, but the shortcode is intended to be used on any other page on the website.

Security Enhancements

Included nonces and user capability checks to ensure secure data submission and AJAX requests.

Error Handling and Logging

Implements logging for errors during the Airtable data fetch or Google Geocoding API calls. Add detailed user notifications in case of failure in the coordinate update process.