> ## Documentation Index
> Fetch the complete documentation index at: https://magicads.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Google Maps Integration

> Enhance your Magic Ads platform with Google Maps to visually see from where you users are connecting and getting registered.

## Introduction

Magic Ads optionally let's you use Google Maps and **User Panel Dashboard** and **User List Dashboard** pages to visually enhance capabilities of tracking from where your users are getting reigstered.

## Google Maps Configuration

To use the Maps JavaScript you must have an API key. The API key is a unique identifier that is used to authenticate requests associated with your project for usage and billing purposes.

<Steps>
  <Step title="Step 1">
    Go to the [Google API Console](https://console.developers.google.com/).
  </Step>

  <Step title="Step 2">
    Once logged in, click the project drop-down and select or **create project** for which you want to add an API key and give it a **project name**.
  </Step>

  <Step title="Step 3">
    If you are using Google API for the first time you will see this screen after creating the project:

    <img src="https://mintcdn.com/magicads/sOSxKmkB3A1LT8Q_/images/advanced/maps/google-maps-1.png?fit=max&auto=format&n=sOSxKmkB3A1LT8Q_&q=85&s=8b42da65d3a0f1043e6ab767a02e6a72" width="776" height="150" data-path="images/advanced/maps/google-maps-1.png" />
  </Step>

  <Step title="Step 4">
    Click **Enable Apis and Services** button or select **Library** button on the left.
  </Step>

  <Step title="Step 5">
    Find **Maps JavaScript API** and enable it as shown below.

    <img src="https://mintcdn.com/magicads/sOSxKmkB3A1LT8Q_/images/advanced/maps/google-maps-2.png?fit=max&auto=format&n=sOSxKmkB3A1LT8Q_&q=85&s=e0997136665a8fefcfbeb612a2af7fcb" width="753" height="300" data-path="images/advanced/maps/google-maps-2.png" />
  </Step>

  <Step title="Step 6">
    Click the menu button and select **Credentials** and click **Create credentials** -> **API key**.

    <img src="https://mintcdn.com/magicads/sOSxKmkB3A1LT8Q_/images/advanced/maps/google-maps-3.png?fit=max&auto=format&n=sOSxKmkB3A1LT8Q_&q=85&s=eefca8f075fe7a9ec6e8fc54500d8c6d" width="937" height="346" data-path="images/advanced/maps/google-maps-3.png" />
  </Step>

  <Step title="Step 7">
    The **API key created** dialog displays your newly created API key, copy it. The new API key is listed on the Credentials page under API keys.

    <img src="https://mintcdn.com/magicads/sOSxKmkB3A1LT8Q_/images/advanced/maps/google-maps-4.png?fit=max&auto=format&n=sOSxKmkB3A1LT8Q_&q=85&s=b95f92680e9615bb799ad131066a2e5d" width="510" height="303" data-path="images/advanced/maps/google-maps-4.png" />
  </Step>

  <Step title="Step 8">
    Login to the Magic Ads as Admin. Go to the **Admin Panel** -> **Backend Settings** -> **Global Settings** and scroll to **Google Maps** section. <br />
    Enter your \***Google Map API Key** and turn on the **Enable Google Maps** checkbox and click **Save** button.

    <img src="https://mintcdn.com/magicads/sOSxKmkB3A1LT8Q_/images/advanced/maps/maps-5.png?fit=max&auto=format&n=sOSxKmkB3A1LT8Q_&q=85&s=853ae8648ce24a792b35535d7e502970" width="834" height="254" data-path="images/advanced/maps/maps-5.png" />
  </Step>

  <Step title="Step 9">
    <Check>Gcongratulations! You now have completed the Google Maps configuration for admin dashboard. </Check>
  </Step>
</Steps>