Customize the location field editor

This article explains how to customize the appearance of the location field editor in the Contentful web app using the App Framework.

Overview

The location field editor enables you to select and store geographic coordinates using a visual interface powered by the Google Maps API. To function, it requires a Google API Key.

Default location field editor

The default location field editor receives a Google API Key as an instance parameter. This key allows the editor to make authorized calls to the Google Maps API.

Create a custom location field editor

To customize the appearance of a location field, you must first build a custom app that supports the Location field type in the entry field.

If your custom location field editor makes use of the default location field editor, you have to provide the App Framework's Google API Key as an instance parameter to the default location field editor.

<LocationEditor
  isInitiallyDisabled={true}
  field={widgetApi.field}
  parameters={{ instance: { googleMapsKey: <GoogleAPIKey> } } }
/>

Use a custom app to define location field appearance

Once your custom app is installed, you can customize the appearance of your location field by selecting it under the "Appearance" section of the field configuration settings.

If you're following best practices regarding instance parameters, this is where the Google API Key can be set to the App Frameworks Google Maps API Key obtained from support.