---
title: How To Setup Google Api
description: "Since version 3.0 DirectoryPress Maps are controlled by an add-on plugin, to use map features please follow steps below. ###### Step: 1 Make sure DirectoryPress Maps plugin is installed and activated. 1. Click DirectoryPress Menu (Fig: 1.1) 2. Click Settings…"
url: "https://help.designinvento.net/docs/directorypress/maps/how-to-setup-google-api/"
updated: "2023-10-23"
category: Maps
---

# How To Setup Google Api

Since version 3.0 DirectoryPress Maps are controlled by an add-on plugin, to use map features please follow steps below.

###### Step: 1

Make sure DirectoryPress Maps plugin is installed and activated.

1. Click DirectoryPress Menu (Fig: 1.1)
2. Click Settings Menu (Fig: 1.1)
3. Click Map Settings (Fig: 1.1)
4. Add  Browser/Javascript API  Key to create api [visit](https://console.developers.google.com/dcredirect?pli=1) for API configuration follow Step 2 below (fig:1.1)
5.  Add  Server API  Key to create api [visit](https://console.developers.google.com/dcredirect?pli=1)  for API configuration follow Step 2 below (fig:1.1)
6. Click Save Changes Button.

[![](https://help.designinvento.net/wp-content/uploads/2020/06/map-settings1-1024x658.jpg)](https://help.designinvento.net/wp-content/uploads/2020/06/map-settings1.jpg)
Fig: 1.1

[![](http://directorypress.co/wp-content/uploads/2020/06/api-10.jpg)](http://directorypress.co/wp-content/uploads/2020/06/api-10.jpg)
Follow steps below to create APIs

###### Step: 2

Please follow  the steps below to create google map api.

1. Google map services are no more free, you may have to activate billing first. (fig: 1.2)
2. Click Create Project Button (Fig: 1.2).
3. Add Project Name, you can set any name of your convenience. (Fig: 1.3)
4. Click Create Button (Fig: 1.3)
5.  Click Google Api Menu at top left corner to open menu panel (Fig: 1.4)
6. Hover over APIs and Services Menu then click Credentials Menu from drop down. (Fig: 1.4)
7. After Clicking credentials menu, make sure you have selected particular project (Fig: 1.5)
8.  Click create credentials (Fig: 1.5)
9. Click API Key from pop over window, an API would be generated, repeat this step to create second API key(Fig: 1.5)
10.  Now Click Pencil icon to edit first API key. (Fig: 1.6)
11. Change API name of your convenience (Fig: 1.7)
12.  Select HTTP referrers from Application Restrictions(Fig: 1.7)
13.  Click Add an item link from Website Restrictions section (Fig: 1.8)
14. Add website links for API authorization. (Fig: 1.8)
15. Hit save button to complete configuration ( Fig: 1.8)
16.  Now edit second api created previously in point number 9 above (Fig: 1.9)
17.  Change API name of your convenience (Fig: 1.10)
18.  Select Server IP from Application Restrictions(Fig: 1.10)
19. Click Add an item link from Website Restrictions section (Fig: 1.10)
20. Add Server IP address for API authorization and hit save button(Fig: 1.10)

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1906 570'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-1.jpg)
Fig: 1.2

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1018 688'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-2.jpg)
Fig: 1.3

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 925 618'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-3.jpg)
Fig: 1.4

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1076 734'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-4.jpg)
Fig: 1.5

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1639 694'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-5.jpg)
Fig: 1.6

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1569 797'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-6.jpg)
Fig: 1.7

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 634 726'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-7.jpg)
Fig: 1.8

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1654 368'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-8.jpg)
Fig: 1.9

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 656 927'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-9.jpg)
Fig: 1.10

###### Step: 3

Follow steps below to enable api services.

1. Click Dashboard menu from side panel (Fig: 1.11)
2. Click enable API services (Fig: 1.11)
3. Click All mentioned services in figure 1.12 one by one to enable required services (Fig:1.12)
4. Click Enable button to activate service, repeat this step for all 5 services (Fig: 1.13)

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1325 691'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-10.jpg)
Fig: 1.11

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 892 554'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-services-1.jpg)
Fig: 1.12

[![](data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 1754 846'%2F%3E)](https://help.designinvento.net/wp-content/uploads/2020/06/api-services-2.jpg)
Fig: 1.13
