Today we will cover the most common issue our customers may face when configuring the maps feature on their WordPress real estate websites. Google Maps API key setup sometimes drives you crazy, doesn't it? However, it is a required thing for proper display and work of maps in Estatik plugins and themes. Before you add your key to the plugin settings, you need to generate and configure it properly.
Below we offer a step-by-step guide how to generate, configure and add your Google Maps API key to the plugin settings. If you follow our instructions thoroughly, you will never have any troubles with Google Maps on your real estate website.
Note: Every single step described below should be made in Google Maps platform https://developers.google.com/
Step 1. Add your billing details
Even though a free plan provided by Google seems to be enough, you still need to add your payment details and assign your billing account to your project (more information about Usage limits and billing can be read here >> https://developers.google.com/maps/faq#usage-limits-and-billing). In short, please do the following:
1. Go to the Google Cloud Platform Console.
2. Click menu button and select Billing.
3. Follow the steps to set up your billing account.
Step 2. Add your project
Now you can assign your billing account to your project or to create a project if you still don't have any.
1. Click Home in your Google Maps Platform menu
2. Select your project or create a new one according to Google instructions.
Step 3. Create your Goole Maps API key
1. Again, click the platform menu and select Credentials sub-menu item.
2. Press Create credentials and select API key. You'll receive a pop-up message that your key is created. Close it and click on Edit icon on the right side.
Step 4. Configure your Google Maps API key
Now the most important specific steps begin, please read carefully.
To make your API key 100% compatible with Estatik plugin, it should have the following settings:
1. In key restrictions please select HTTP referrers (web sites)
2. Add your website like it is asked
3. Enable required APIs, namely:
* Geocoding API
* Geolocation API
* Places API
* Maps Static API (required for PDF flyer)
You can find them all in Library or Marketplace of your google cloud platform:
Find the required API and click Enable button.
Just click on enable button or leave it if it is already enabled:
NOTE: If you use Estatik Premium plugin version, two Google Map API keys are required. Create the second API key according to instructions above with a few changes:
- choose restriction by IP addresses,
- add your server IP,
Please find more screenshots in plugin documentation.
Only thereafter you can add your Google Maps API key in the plugin Settings:
If you have any issue and the maps still do not work properly, our support will dig into it and help but please submit your tickets via Support Area. We'd also would like to share a great video tutorial from Google Maps support team that would come in handy.