Web Global Net Web Application & Web Development Project Center

Technical Issues => Google Related => Topic started by: admin on July 18, 2019, 02:02: PM

Title: Google Maps API key installing & embedding overview
Post by: admin on July 18, 2019, 02:02: PM
This is not a definitive guide but it worked for us, google developer area is very confusing at times and seems to be geared towards high developers only/mostly.

Steps needed to get an API key for your website.


Create Google account (email account is fine)

Enter developer area for Maps:

You'll need to add a billing Credit Card but since most small sites will not reach the 100,000 loading level and the fact that Googles gives you a $200 credit each months - effectively means no cost to you.Google also will not charge you with out notifying you first.

Create a project for your account and then

In order to get the API key for mapping you'll need to add and verify the domains you want to place maps on. Not sure how many you can add , at least 20 though. you verify by adding an HTML page they generate for you to the top level of your server for each domain you want maps on.


Once you have verified your domains you can then generate an API key to use.

We chose the Javascripting API method.

To add to your page add this script to your head area

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBdFXzsyyUuwVl1eNvaOpjEd5IG3fzE&libraries=geometry">

Replace the Bold Red section with your Google API code

<iframe width="95%" height="400" frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/search?q=<?php echo $row_rsaddisplay['ad_address11']; ?>,<?php echo $row_rsaddisplay['ad_city2']; ?>,<?php echo $row_rsaddisplay['state_name']; ?>,<?php echo $row_rsaddisplay['ad_zip2']; ?>&key=AIzaSyBdFXzsyyUuwVl1eNvaOpjEd5IG3fzE" allowfullscreen></iframe>

Code in Blue (Address) in our case generates the search address for the map dynamically - the Red Code is your Google API key
The orange settings you can change to what ever you want too.

Thats basically it for have a google map on your site - simple.

You can change the Blue code to a static address if you want also.