Google login is a valuable feature that allows users to access a website quickly and conveniently, without the need to create and remember additional passwords. This login option simplifies the user experience and is a welcome addition to any website. In this article, we will explain how to configure Google login in eDirectory, step by step. Integrating with Google provides your visitors with an easy and secure way to access your website using their Google accounts.
Instructions:
1. The first step is to access the Google API Console website through the link: https://console.developers.google.com/
2. In the Google API Console, create a new project for your website. You can create a project by clicking "Create Project" directly or by clicking "Select a project" and then "New project."
3. By clicking on either of the options above, you will be redirected to the page shown below, where you can create your project. We recommend entering your site's name in the "Project name" field and then click "Create":
Note: You do not need to fill in the "Location" field; you can leave it as the default option: "No organization."
4. After creating your project, you will see it at the top of the page in a dropdown. Note that in our example, the project is named "Test," but when your project is created, and you enter your site's name in the "Project name" field (as shown in the previous step), your site's name will be displayed. Now, click on the "OAuth consent screen" option as highlighted in the screenshot below:
5. By clicking "OAuth consent screen," the following screen will appear. Select the "External" option and click "Create":
6. Fill in all the necessary information about your site:
App Name: Your website’s name
User support email: Add your email here
Application home page: Enter the link to your site's homepage.
Application privacy policy link: Insert the link to your site's privacy policy page.
Application terms of service link: Insert the link to your site's terms of service page.
Authorized Domains: Click the "Add domain" button and enter your site's domain in this format without https and without www: test.com (Replace "test" with your site's correct domain)
Developer contact information: Insert your email address here.
Note: Replace "test" in the example links shown in the screenshot with your site's correct name.
After configuring all the required fields, click "Save and continue."
7. After setting up the fields in the previous step and saving, follow these steps:
- Click on "Credentials" in the left sidebar.
- Click "Create Credentials."
- Click "OAuth client ID."
8. On the next page, fill in the necessary information:
Application Type: Web Application option.
Name: Give it a Name, for example “Google Login”
Authorized Javascript Origins: enter the home page link of your website with 2 variations in this format:
Notice: Replace “test” with your site domain.
Redirect URLs: enter the two variations of the home page link with the following extension: sponsors/googleauth.php for example:
Notice: Replace “test” with your site domain.
Notice: In order to configure Google login, first it is needed to have a live domain (URL) connected to your site. If you would like to change the domain of your website, contact our team on the email: support@edirectory.com.
If you don't enter this information exactly as it is described, the integration won't work. When you are done, click the Create button.
9. After clicking "Create" in the previous step, a pop-up window will appear with your Google API login information. Copy your Client ID and Client Secret:
10. Go to the administrative area of your site, navigate to "Settings" → "Sign-in Options." Check the "Enable sign in using Google" box and paste your Client ID and Client Secret in the corresponding fields. Then, click the "Save Changes" button.
Now, Google login is configured on your site, and visitors can log in using their Google accounts in a simple and secure manner.
Remember to follow these steps carefully to ensure that the integration works correctly and enhances the user experience on your site.