Getting Started With the Maps Layout

In this article, we’ll show you how to get set up with the GravityView Maps Layout.

Note: The Maps Layout is included in GravityKit's All Access license.

Prefer to Watch the Video?

Installing the Maps Layout

You can install the Maps Layout from inside WordPress. Simply hover over Views, click Manage Add-Ons, scroll down to the “Maps Premium View” and click Install.

The Install button for the Maps Layout on the GravityView Manage Add-Ons page in WordPressFor the Maps layout to work correctly, you'll need a valid Google Maps API key.

Signing up for a Google Maps API key

If you don't already have one, click here to go to the Google Maps Geocoding API page, then click the "Get started" button at the top right.

Signing up for a Google Maps API key

After creating your API key, ensure you enable both the Geocoding API and the Geolocation API.

The Google Geocoding API and Geolocations API

For step-by-step instructions on obtaining your Google Maps API key, please see the following article: Signing up for a Google Maps API Key

Create a Form With an Address Field

To display Gravity Forms entries on a map, your form must have an Address field. GravityView will then geocode the address and display it as a marker on your map.

The Gravity Forms Address field

If you're using a different field type to capture address information (e.g. Single Line Text), it is still possible to use the Maps extension, but you'll have to override the Address Field setting. Please see this article for instructions on how to do this: How can I pull the address from a field type that is not Address?

Enter Your Google Maps API Key on the GravityView Settings Page

Hover over Views and click Settings. Now scroll down to the Maps settings and enter your key in the box. Remember to click the Update Settings button at the bottom to save it.

The box to enter your Google Maps API key on the GravityView Settings page in WordPress

You can now create a View using the Maps layout!

Create a View Using the Maps Layout

Hover over Views and click New View. Next, give your View a name and select a data source. Now, under “Choose a View Type”, select “Map”.

Choosing a View type in GravityView

Now you can start configuring your View using the GravityView drag-and-drop editor. When you're done, scroll down to the View Settings and click on the Maps tab. Here you'll find a range of options for customizing your map.

The Maps settings panelThat's it! Now open your View on the front end. Your form entries should be displayed as markers on a Google Map.

Example map displaying on a View

Troubleshooting the Maps Premium View Extension

Are you having trouble getting your map to display correctly? There are several possible reasons for this. Here are some common issues and their solutions:

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us