> For the complete documentation index, see [llms.txt](https://magecomp.gitbook.io/shopify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://magecomp.gitbook.io/shopify/apps/hook-social-login/configuration/google-client-id-configuration.md).

# Google Client ID Configuration

To enable the button's functionality in your store, you need first to **create Google client ID.**

Follow the following steps to create a Google client ID.

<mark style="color:blue;">**Step #1**</mark>

Go to [**Google Developers Console**](https://console.developers.google.com/apis).

<figure><img src="/files/oqNy42UjKHppvoNybwfA" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #2**</mark>

Select the dropdown option, at the left side of the search box, or you can just click on the **Create** button provided in our app on the main page of the app's backend.

Select the **New Project** button to **create** a new project.

<figure><img src="/files/xw2pICq29ttLIs5gcC3r" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #3**</mark>

Navigate to the **OAuth consent screen** and, go to **User type,** and select **External**. Select the **Create** button.

<figure><img src="/files/EFbRW2xpkL6YVso83857" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #4**</mark>

Enter the app name and your user support email address. Upload the app logo.

Enter the developer's contact information and authorized domain. After getting done with the configurations, click the **Save** button and continue.

<figure><img src="/files/pj27VJsNv74fzkRQNKWr" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #5**</mark>

After completing all these steps falling under the **OAuth consent screen**, navigate to **Back to dashboard.**

<figure><img src="/files/fSmRE17QtoA2FDeL2jj5" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #6**</mark>

Follow these steps **Credentials** <mark style="color:blue;">➤</mark> **Create Credentials** <mark style="color:blue;">➤</mark> **OAuth client ID.**&#x20;

Choose **Web Application** from the dropdown list and enter the name of your OAuth 2.0 client.

Enter the URLs to the **Authorized JavaScript origins and Authorized redirect URLs** by clicking the **Add URL** button.

These URLs will redirect your users back after they have been authenticated with Google.

Copy the **Client ID** and proceed.

Once you are done with all these configurations, you have to enter the Google ID in the **Settings** field of the app's backend section.

<figure><img src="/files/l6HJTx7jFJKp6n88t4y8" alt=""><figcaption></figcaption></figure>

<mark style="color:blue;">**Step #7**</mark>

After following all these steps, go to **Online Store** <mark style="color:blue;">➤</mark> **Preferences** <mark style="color:blue;">➤</mark> **Spam Protection** and **Disable** the by default selected options:

* Enable hCaptcha on contact and comment forms
* Enable hCaptcha on login, create account and password recovery pages

<figure><img src="/files/U71nwVeg3p0cuEBYjnlG" alt=""><figcaption></figcaption></figure>

{% hint style="danger" %}
It is necessary to keep these two options **Disabled** as they cause errors sometimes, which may cause a bad user experience.
{% endhint %}

<mark style="color:blue;">**Step #8**</mark>

Ensure the **Customer Accounts Type** is set to **Legacy**. If not, update the configuration.

<figure><img src="/files/wmsLo6uh9Gq49T5Yidya" alt=""><figcaption></figcaption></figure>
