Magento 2 Google One Tap Sign-in

Magento 2 Google One Tap Sign-in extension integrates Google One Tap facility in Magento 2 store to allow users to sign-up or sign-in on a website with a single tap and thus improving the user experience of the store.

 

Table of Content

  1. Extension Installation Guide
  2. Configuration
  3. Google One Tap Sign-in Prompt in Frontend
  4. Customer Account Auto Creation in Backend

 

  1. Extension Installation
  • For Magento Marketplace Customers
      • Create a folder structure in Magento root as app/code/Meetanshi/OneTap
      • Download and extract the zip folder and upload our extension files to the app/code/Meetanshi/OneTap via FTP.
      • Login to your SSH and run below commands step by step:
  • php bin/magento setup:upgrade
  • For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
  • For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
  • php bin/magento cache:flush

 

  • For Meetanshi Customers
      • Extract the zip folder and upload our extension to the root of your Magento 2 directory via FTP.
      • Login to your SSH and run below commands step by step:
  • php bin/magento setup:upgrade
  • For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
  • For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
  • php bin/magento cache:flush

 

  1. Configuration
    To configure the extension, login to Magento 2 backend, move to Stores à Configuration à Meetanshi à Google One Tap Sign-in where you can find various settings to configure the extension.
  • Google One Tap Sign-in: Enable or disable the extension from here.
  • Client ID: Get your client ID from https://console.developers.google.com/apis. Follow the steps to get your Google API client ID. Don’t forget to configure OAuth consent screen to show privacy policy and terms of service links in Google one tap sign-in prompt.
  • Auto Sign-in Without Clicking Prompt: Select YES to auto sign-in users when they return to your site even after their session expires.
  • Close Prompt on Background Click: Select YES to close the Google one tap prompt on background click.
  • Prompt Position: Set one of the preferred Google one tap prompt positions.

Note: As mentioned in https://developers.google.com/identity/gsi/web/guides/change-position, data-prompt_parent_id attribute is ignored on mobile web browsers and thus, the position you set above will not affect the prompt position in the mobile devices.

 

  1. Google One Tap Sign-in Prompt in Frontend
    Once you have configured the extension successfully, if the user is logged in to the Google account in a browser, he/she can see Google One Tap Sign-in prompt on the Magento 2 Sign-in page in the set position. The Google one tap sign-in prompt contains a link to privacy policy and terms of service if added during configuration of the OAuth consent screen while getting the client ID. Also, it contains a button to continue sign-up or sign-in with the preferred Google account.

 

    • Google One Tap Login Successful
      Immediately after the user selects a Google account to sign-up or login, if the user is new, he will be logged in and redirected to the My Account page and a new customer account is auto created in the Magento 2 backend. If the customer is a returning one, he’ll be auto logged in on clicking prompt.

 

  1. Customer Account Auto Creation in Backend
    If the user is new while using the Google one tap sign-in prompt, the customer account is auto created in the Magento 2 admin panel. The admin can see a new customer created under Customers > All Customers grid.