Google client ID in developers console - new tutorial

2021-03-30 api, client, google, login, register

Google recently totally redesigned and changed the steps that are required to follow to obtain "Client ID" number that is required for "google login" app and other apps where you need to get visitor details from google api. In this guide i will step by step describe the process of APP creation process that will be ready to use in our google login module .

 

google login developers console tutorial

  • inside "configuration" window of your "new project" type the name of your app (it can be anything you want, like "login feature" etc. it's for your information only, customers will not see it) 

google login developers console tutorial

  • on next step we need to click on dropdown list and select there project you created 

google login developers console tutorial

  • then we need to select "oauth consent screen" and option 'external'

google login developers console tutorial

  • then on next page we need to define app details (these details will see customer that uses login with google): 

google login developers console tutorial

    1. app name
    2. contact email with your support / help / data privacy agent etc.
    3. you can upload your own picture (it will be visible for your customers inside login window)
    4. type url to your shop
    5. type the url to your privacy policy document (it can be terms and conditions if you have there some informations about privacy) 
    6. type the url to your shop terms and conditions
  • If during configuration of "consent screen" you will see information that domain is not verified - you will see additional field where you will need to just type the domain of your shop
  • on next step right after "confirmation" of settings click on button add or remove scopes: 

google login developers console tutorial

  • select there two permissions:  

google login developers console tutorial

 

  • then just accept settings (to times or more, just to finish the configuration)
  • on next step go to "credentials" section and click on button: "create credentials" 

google login developers console tutorial

  • Firstly select "API KEY"
  • Next - select "Oauth client" - we will be redirected to form:  

google login developers console tutorial

 

    1. select there: "web application"
    2. type there name (this is only for your information)
    3. type there url to your shop (it is very important to provide valid url. If your shop works with "https" type there url with "https" - its very important)
    4. type the url again (focus on correct url as well)

 

  • after save you will get your "Client ID" number. Just copy it and use it in configuration of the "google" login module.
  • then go back to developers console to "oauth consent screen":  
    google login developers console tutorial
    1. open oauth conset screeen
    2. create "test user"
    3. click on "publish app"

 

that's all

your app is ready to use.

author milos myszczuk
Article by Milosz Myszczuk PrestaShop expert, official PrestaShop community moderator. PHP developer, specialist in relative and spatial databases management, GIS Analyst, CEO & founder of VEKIA interactive agency. Read more about VEKIA company
If you like my articles and want much more valuable tips, feel free to send me donation
1.4 version 1.4.11 1.6 404 addon admin advertise ahref ajax alpha animation api app application authentication back office backup badge banner basics block bootstrap button cache carrier cart catalog category certificate changelog chat class clear client clip cms code colors columns comments configuration contact container content controller cookie counter country coupon css csv currency customer dashboard database debug default delete delivery desktop developer device disable discount displayNav displayTop download dynamic editor effect empty encrypt engine error exchange exclude export facebook faceshop fade fancoupon fancybox fanpage fatal feature feed field file fix fixed font footer free friendly url front ftp full gallery generate gift global godaddy google google+ gray grid groupon header help hide highlight homefeatured homepage hook hosting hover howto htaccess html html5 ID image import include input instagram installation integration iPhone issue javascript jquery kgb knowhow languages law left likebox link list livingsocial loading log login logo loyality mail mailing maintenance manufacturer marketing marquee mcrypt menu meta mobile modification module movie moving multilanguage multiupload must have mysql news newsletter notification number open graph order override page password performance PHP phpmyadmin picture pinterest plugin popup post prestashop prestashop 1.0 prestashop 1.1 prestashop 1.2 prestashop 1.3 prestashop 1.4 prestashop 1.5 price rules problem product profile promotion proslider purifier quantity query quick tip random rates register reinsurance release reporting reset responsive restore results ribbon rich text right sales search security seo service shadow share shipping shop shopmania slider smarty social networks SQL SSL statistics stock store style subcategory superuser support switcher tab tablet tag tax template text theme tinyMCE tips and tricks tpl tracking translations tree trends trigger tumblr tutorial twitter update upgrade upload variables video visits voucher vulnerability web2print wide widget width window wishlist wysiwyg youtube zip zopim