How To create a google sign in and sign up page with code for your website

 To create a Google Sign-In button for your webpage, you need to follow these steps:


Create a new project in the Google Cloud Console and create credentials and a client ID.

Include the Google Platform Library on your web pages that integrate Google Sign-In.


html


<script src="https://apis.google.com/js/platform.js" async defer></script>

Add the following HTML code to your webpage, replacing YOUR_CLIENT_ID with your actual client ID.

html

<div class="g-signin2" data-onsuccess="onSignIn" data-client_id="YOUR_CLIENT_ID"></div>

Add the following JavaScript code to your webpage to handle the sign-in process.

javascript


function onSignIn(googleUser) {

  var profile = googleUser.getBasicProfile();

  console.log('ID: ' + profile.getId());

  console.log('Name: ' + profile.getName());

  console.log('Image URL: ' + profile.getImageUrl());

  console.log('Email: ' + profile.getEmail());

}

To allow users to sign out of your app without signing out of Google, add a sign-out button or link to your site.

html


<a href="#" onclick="signOut();">Sign out</a>

<script>

  function signOut() {

    var auth2 = gapi.auth2.getAuthInstance();

    auth2.signOut().then(function () {

      console.log('User signed out.');

    });

  }

</script>

Note: The above code is just a basic example, you can customize it according to your needs. Also, make sure to replace YOUR_CLIENT_ID with your actual client ID.


Post a Comment

Previous Post Next Post