---
title: "How to add Google login to a WordPress website?"
url: https://nexterwp.com/docs/add-google-login-to-wordpress/
date: 2023-03-04
modified: 2026-08-18
author: "Aditya Sharma"
description: "With WordPress powering a growing number of websites on the internet, it's no surprise that it is one of the most popular content management systems in use. To make it..."
image: https://nexterwp.com/wp-content/uploads/2024/05/add-google-login-to-wordpress-1024x519.jpg
word_count: 734
---

# How to add Google login to a WordPress website?

## Key Takeaways

- Nexter Blocks Login & Signup block adds a Google login option to a WordPress login or registration form.
- Google Client ID setup starts in the Google Developers Console, where the user creates a project, configures the OAuth consent screen, and publishes the app.
- OAuth client ID creation uses Application type Web application and requires Authorised JavaScript origins and Authorised redirect URLs with the website URL.
- Social Login in the Login tab enables the Google toggle, supports Google One Tap Popup, and offers Redirect URL plus button options like Standard, Icon, Theme, Shape, Button Text, Icon Shape, Size, and Alignment.

With WordPress powering a growing number of websites on the internet, it's no surprise that it is one of the most popular content management systems in use. To make it easier for users to access your website, offering a wide range of login methods is important. One of the most popular methods is to add a Google login option to your WordPress website. This allows users to log in using their existing Google account, reducing the need to create yet another username and password combination.

With the Login & Signup block from Nexter Blocks, you can easily add a Google login option to your login or registration form.

*To check the complete feature overview documentation of Nexter Blocks* Login & Signup block, [click here](/docs/login-signup-block-settings-overview/).

***Requirement  - This block is a part of Nexter Blocks***, make sure its installed & activated to enjoy all its powers.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-login-form/)

First, you have to generate your **Google Client ID**.

## Generate Google Client ID

1. For this, you have to login to your Google account and go to the [Google Developers Console](https://console.developers.google.com/).

2. If you don’t have any project created, then click on **CREATE PROJECT **link.

![google client id 1](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-1-1.png)

3. On the next screen, add your **Project name** and click the **CREATE** button.

![google client id 2](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-2.png)

4. Then click on the **OAuth consent screen** on the left sidebar.

![google client id 3](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-3.png)

5. On that page, select the User Type and click the **CREATE** button.

- Internal – Only available to users within your organisation.

- External – Available to any user with a Google Account.

![google client id 4](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-4.png)

6. On the next page, add your app information. **App name**, **User support email** and **Developer contact information** fields are mandatory rest are optional until you deploy your app.

Then click on the **SAVE AND CONTINUE** button. 

![google client id 5](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-5.png)

7. On the Scopes page, click the **SAVE AND CONTINUE** button.

![google client id 6](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-6.png)

8. Also, on the Test users page, click the **SAVE AND CONTINUE** button.

![google client id 7](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-7.png)

9. On the Summary page, click the **BACK TO DASHBOARD **button at the bottom.

![google client id 8](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-8.png)

10. On the next page, click on the **PUBLISH APP** button to publish your app.

![google client id 9](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-9.png)

11. Once done, click on **Credentials** in the left sidebar.

![google client id 10](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-10.png)

10. On the Credentials page, from the top, click on **+ CREATE CREDENTIALS** > **OAuth client ID**.

![google client id 11](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-11.png)

11. Then, from the **Application type** dropdown, select **Web application**.

![google client id 12](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-12.png)

12. Once you select the option then, you have to add the following details.

- **Name** - Add your application name.

- **Authorised JavaScript origins** - Click the **ADD URI** button to add your website URL - Example: *http://www.yourwebsite.com*.

- **Authorised redirect URLs** - Click the **ADD URI** button to add your website URL - Example: *http://www.yourwebsite.com*.

Once done, click on the **CREATE** button.

![google client id 13](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-13-1.png)

13.  On the next page, you’ll get your **Client ID** and **Client Secret,** copy and paste them into a notepad.

![google client id 14](https://nexterwp.com/wp-content/uploads/2023/03/google-client-id-14-2.png)

> *Note: For the Login & Signup block, you only need the Client ID.*

## Add the Client ID in the Login & Signup block

Once you have your Client ID, add the block on the page, go to **Forms** > **Type** and select any of the form types **Login**, **Register** or **Login & Register**. 

Select the appropriate layout from the **Layout** section.

> *Note: Here, we are using the Login form, but following the same process, you can add Google login to both ****Register**** and ****Login & Register**** forms.*

![](https://nexterwp.com/wp-content/uploads/2023/03/login-signup-login-type-new.png)

Once your form fields are ready, go to the **Login** tab and click the **+Add Field** button.

From the **Field** dropdown, select **Social Login**.

From there, turn on the **Google** toggle to enable login via Google. Add your id in the **Google Client ID** field.

You can also enable **Google One Tap Popup** by turning on the toggle. With this option, it will automatically show a popup asking the user to login via Google.

But if you don’t enable **Google One Tap Popup**, you’ll see a few more options.

**Type** - From here you can choose the button type, Standard or Icon.

**Theme** - You can select the button theme.

**Shape** - For the Standard button shape.

**Button Text** - You can choose from different button texts for the Standard button.

**Icon Shape** - For the Icon button shape.

**Size** - For the button size.

Finally, in the **Redirect URL** field, you can add a page link to redirect users to a specific page after login.

From the **Alignment,** you can align the button in the form.

Also, check [How to add Facebook login to a WordPress website](https://nexterwp.com/docs/add-facebook-login-to-wordpress/).

## Frequently Asked Questions

**Q: Why is Google login not showing on my WordPress form?**
A: Google login only appears when the Login & Signup block from Nexter Blocks is installed and activated, and the Google toggle is turned on inside the Social Login field. The tutorial also says you need to paste the Google Client ID into the Google Client ID field. If either piece is missing, the social login option will not be ready for users.

**Q: What do I need before adding Google login to a WordPress website?**
A: The key requirement is the Login & Signup block from Nexter Blocks, plus a Google Client ID from the Google Developers Console. The setup starts by creating a project, configuring OAuth consent, and then creating an OAuth client ID for a Web application. That Client ID is the only value the block needs for Google login.

**Q: Does Google login work with both registration and login forms?**
A: The tutorial says the same setup works for Login, Register, and Login & Register forms. That matters because you are not locked into one form type after enabling Social Login. Nexter Blocks lets you add Google login to whichever form layout fits your flow, which is useful if you want sign-in and sign-up on the same page.

**Q: What should I choose when creating a Google OAuth client ID for WordPress?**
A: The Application type should be set to Web application. The tutorial also calls for adding your website URL under both Authorised JavaScript origins and Authorised redirect URLs. That pairing matters because Google needs to recognize where requests start and where users return after authentication.

**Q: Should I use Google One Tap Popup or the regular Google button?**
A: Google One Tap Popup is the faster path if you want a popup that asks users to log in with Google automatically. If you leave it off, the block exposes more button controls like Type, Theme, Shape, Button Text, Icon Shape, Size, Redirect URL, and Alignment. That makes the regular button better when you want more control over how it looks and where users go after login.

**Q: What happens after I add the Google Client ID in the Login & Signup block?**
A: Once the Client ID is in place and Google login is enabled in Social Login, users can log in with their existing Google account instead of creating another username and password. The tutorial also notes that you can set a Redirect URL to send users to a specific page after login. That is useful when you want logged-in users to land somewhere other than the form page.