Introduction
Follow these steps to obtain the Google Client ID and Secret Key, enabling both Google registration/login and Google One Tap Login for users on your website.
This process involves setting up a project in the Google Developer Console, configuring OAuth credentials, and enabling the One Tap Login feature.
Step-by-Step Instructions
Access the Google Developer Console
Go to the Google Developer Console and log in using your Google Developer account (e.g., [email protected])
Create a New Project
Click the Create a Project button.
Set the project name with your website name.
Set the Organization and Location fields to your website’s domain. For example: website.com.
Submit the form.
You’ll see the newly added project in the “Select a Project” pop-up or on the homepage.
Configure the OAuth Consent Screen
After selecting your project, go to the API & Services section, then click on the OAuth consent screen.
Choose the “External” option and click Create.
On the next page:
The app name field will be your website name
The User Support Email will be the email address of your Google Developer account.
Upload your logo.
In the App Domain section, fill in the Application Home Page with your website domain, including “HTTPS”.
For Authorized Domain 1, add your website domain without “HTTPS”.
In Developer Contact Information, enter the Google Developer account email.
Click Save and Continue.
Set Scopes
The next step will be for the scopes, Click on Add or Remove Scopes and check the following three scopes:
userinfo.email (to access the user's primary Google Account email address).
userinfo.profile (to view personal information that the user has made publicly available).
openid (to associate the user with their Google account information).
Click Save and Continue.
Skip Test Users
You can skip the Test Users section and proceed to the next step.
Create OAuth Credentials
Go to the Dashboard and select the Credentials tab from the left-hand menu.
Click on Create Credentials and choose OAuth client ID.
Select the application type that suits your needs.
Enter your website name.
In the Authorized JavaScript Origins section, input your website URL (e.g., https://www.website.com).
In the Authorized Redirect URIs section, input your website URL followed by /login/google/callback (e.g., https://www.website.com/login/google/callback).
Click Create.
Copy Your OAuth Client ID and Secret Key
Once the OAuth client ID is generated, you’ll see a pop-up displaying your Client ID and Client Secret.
Copy both keys.
Add Keys to Your Admin Panel
In the Newsifier admin panel, go to Settings > Share tab > Third party credentials section > Google App .
Paste the Client ID into the Google App ID field and the Client Secret into the Google App secret key field.
Enabling Google One Tap Login
What is Google One Tap Login?
Google One Tap Login provides a seamless login experience by allowing users to log in or sign up with a single click. This feature integrates with Google accounts to streamline the process and reduce friction, making it easier for visitors to register on your website.
How to Enable One Tap Login in Newsifier
After adding the keys from Google Developer Console into Newsifier admin panel, toggle the setting to On.
