In order to use this great tool on your website please follow the steps below:


Important: If you already set up your Google Maps API, you can use the same project. Skip to Step 12 to continue this process: 


1. Navigate to https://accounts.google.com/Login and login to the Google account you will be using with your site


2. After logging in, navigate to https://console.developers.google.com/apis/library


3. Click on Project - Create a project in the upper-left hand portion of the screen, or use an already existing project:



4. Once the project is created click on APIs & Services and go to Credentials



5.  Then click on Create Credentials and select API Key



6. Click on Restrict Key



7. Enter a name for this API key into the "Name" field.  We are going to leave the default name "API key 1" for this tutorial, but you can use anything you like:





8. Select HTTP referrers (web sites):



9. The next step is to enter the proper domains into the "Accept requests from these HTTP referrers (web sites)" field:



10. THIS STEP IS EXTREMELY IMPORTANT, PLEASE BE SURE TO COMPLETE THIS CORRECTLY


For the purposes of this tutorial, let's imagine that the domain of my website will be on is http://www.ilovebrilliant.com.  It is very important that you know what the final domain of your website will be for this step.


Enter the following one at a time to the "Accept requests from these HTTP referrers (web sites)" field.  Press ENTER after typing in each domain to add it to the list:


*.directoryup.com

*.managemydirectory.com

managemydirectory.com

*.ilovebrilliant.com  (IMPORTANT: Replace "ilovebrilliant.com" with the final domain that YOUR website will be hosted on)

ilovebrilliant.com  (IMPORTANT: Replace "ilovebrilliant.com" with the final domain that YOUR website will be hosted on)



After you have completed the above, you should see the following:





(REMEMBER: You will not see "ilovebrilliant.com" in the list.  You will see the final domain of YOUR website in the list instead)



11. Click on "Save":


12. After this is created, please click on OAuth consent screen



13. Fill out the fields and click on save (make sure to include https):



Important: If you aren't sure where to find the terms of use and privacy, feel free to ask support.


14. This will take you back to the Credentials page, from here create credentials again






15. Click on OAuth client ID and select Web Application and input your website's URL (make sure to include https):



16. Click on Ok next.


17. Click on Dashboard 



18. Search for the word Google People API and enable it.



19. Go back to Credentials and copy the API key and Client ID


20. Go back to your admin page and go to Settings - General Setting - Integrations, in here you can paste the key provided for you:


    a. Paste the API Key inot the Google Developer Key.


    b. Paste the Client ID into the Google Developer Client ID.



21. Click Save.



You also have the option to Enable the Google Login, if this is set to Yes your login form will contain this option:



If it's set to No, they will not have the ability to use the Google login but they can still use their Google account to sign up.


Also, if there isn't a key in the field, this option will never show up on the login form.


22. Once this is set up, you will need to go to Finance - Manage Products and edit the levels you wish to grant this to.



23. Click on Additional Settings Tab and make sure this is set to YES.


24. Make sure to Save Product Details, even if it's already set to Yes.


Your Google Login is now setup! 


If this isn't working after you have followed these steps, please make sure the following widgets are deactivated:


Bootstrap Theme - Success Page - Free Member Sign Up
Bootstrap Theme Framework

Bootstrap Theme - Account - Member Dashboard


The forms that will be set back to default in order to make this work are:


Sign Up - Free Member

WHMCS - Paid Signup