How to Create Distance Matrix API and Maps Javascript and Places API for WooFood
the
  1. Go to the Google Cloud Platform Console.
  2. Click the Select a project button, then select your project you set up for the WooFood and click Open. *If you don’t have a project create a new on 
  3. From the list of APIs on the Dashboard, look for Places API.
  4. If you see the following APIs Maps Javascript API , Distance Matrix API , Places API  in the list, are already enabled. If the APIs are not listed, enable them:
    1. At the top of the page, select ENABLE APIS AND SERVICES to display the Library tab. Alternatively, from the left side menu, select Library.
    2. Search for Places API, then select it from the results list.
    3. Select ENABLE. When the process finishes, Places API appears in the list of APIs on the Dashboard.
    4. Repeat steps 2 and 3 for Maps Javascript API and Distance Matrix API

The next step is to create API Keys to use them inside WooFood settings. On this step you must create 2 different API Keys. The first one will be used for Address Automatic Completion while the other one will be used to calculate the distance from the store to your customer location.

Important Note: We need to  create 2 separate keys because we cannot apply the same restrictions keys. Different restrictions are required to applied to each key.

First step is to create the Key for Address Autocompletion.

  1. Go to the Google Cloud Platform Console.
  2. Click the project drop-down and select or create the project for which you want to add an API key.
  3. Click the menu button  and select APIs & Services > Credentials.
  4. On the Credentials page, click Create credentials > API key
    The API key created dialog displays your newly created API key.
  5. Click Close. 
    The new API key is listed on the Credentials page under API keys
    (Remember to restrict the API key before using it in production.)

Second step is to restrict the API key for Address AutoCompletion

  1. Go to the Google Cloud Platform Console.
  2. Click the project drop-down and select the project that contains the API key you just created on the above step.
  3. Click the menu button  and select APIs & Services > Credentials.
  4. On the Credentials page, click the name of the API key that you want to secure.
  5. On the Restrict and rename API key page, set the restrictions:
    • Application restrictions
      • Select HTTP referrers (web sites).
      • Add the referrer as this example: https://yoursiteurl.com/* Notes: Be sure that you have including the asterisk (*) at the end of url to catch all the urls of your website. Also if you are using www don’t forget to include it on your url.
    • API restrictions
      • Select Restrict key.
      • Click Select APIs and select Maps JavaScript API and Places API
        (If the Maps JavaScript API is not listed, you need to enable it.)
    • Click SAVE.

Let’s create the Distance Matrix API Key for WooFood to be able to calculate the distance

This is actually the same process as we done previously with the previous key.

  1. Go to the Google Cloud Platform Console.
  2. Click the project drop-down and select or create the project for which you want to add an API key.
  3. Click the menu button  and select APIs & Services > Credentials.
  4. On the Credentials page, click Create credentials > API key
    The API key created dialog displays your newly created API key.
  5. Click Close. 
    The new API key is listed on the Credentials page under API keys
    (Remember to restrict the API key before using it in production.)

Apply Restrictions to Distance Matrix API Key

  1. Go to the Google Cloud Platform Console.
  2. Click the project drop-down and select the project that contains the API key you just created on the above step.
  3. Click the menu button  and select APIs & Services > Credentials.
  4. On the Credentials page, click the name of the API key that you want to secure.
  5. On the Restrict and rename API key page, set the restrictions:
    • Application restrictions
      • Select IP Addresses
      • Add your Server’s IP Address here Notes: If you are not use what’s your Server’s IP you can check it by going to https://dnsmap.io/   and type your domain name and select A and press Check DNS Propagation
    • API restrictions
      • Select Restrict key.
      • Click Select API and select Distance Matrix API
        (If the Maps JavaScript API is not listed, you need to enable it.)
    • Click SAVE.

When you finish the setup with keys your configurations should like the following screenshots

This configuration is for Places API and Maps Javascript API that will be used for address autocompletion

How to Create Distance Matrix API and Maps Javascript and Places API  for WooFood 1

This screenshot is for the Distance Matrix API Configuration

How to Create Distance Matrix API and Maps Javascript and Places API  for WooFood 2