Get your Google Maps API key

MapFlow needs a Google Maps API key. Follow these steps once.

Step by step

1. Open the Google Cloud Console and create a project.

2. Go to Billing and link an active billing account. Without it, the map will not load.

3. Open APIs & Services, then Library, and enable Maps JavaScript API.

4. Go to Credentials and create an API key.

5. Restrict the key (see below).

6. Copy the key. You will paste it into MapFlow in the next guide.

Restrict your key

A browser key is visible in the page, so restrictions are what keep it safe.

• Application restriction: choose Websites (HTTP referrers). Add your own domain, for example yourdomain.com/*, plus *.framer.app/*, *.framer.website/* and *.framercanvas.com/*.

• API restriction: allow only Maps JavaScript API.

Protect yourself from surprise charges

In Billing, open Budgets & alerts and create a budget alert, for example at $1.

Tip: Use one API key for every map on the same page. Google allows only one key per page.