Google Sign in

**Houdini** · 04 March 2018, 02:13 PM

I am trying to add a google sign in to my site
https://developers.google.com/identi...fore_you_begin
I followed that and got my client id etc
then I inserted the code in a placeholder

heres my code

HTML Code:

<html lang="en">
  <head>
    <meta name="google-signin-scope" content="profile email">
    <meta name="google-signin-client_id" content="*************************************.apps.googleusercontent.com">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
  </head>
  <body>
    <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"></div>
    <script>
      function onSignIn(googleUser) {
        // Useful data for your client-side scripts:
        var profile = googleUser.getBasicProfile();
        console.log("ID: " + profile.getId()); // Don't send this directly to your server!
        console.log('Full Name: ' + profile.getName());
        console.log("Email: " + profile.getEmail());

        // The ID token you need to pass to your backend:
        var id_token = googleUser.getAuthResponse().id_token;
        console.log("ID Token: " + id_token);
      };
    </script>
  </body>
</html>

When I preview whole site it renders the button which does nothing.
Am I missing something or overlooking?

**gwpriester** · 04 March 2018, 06:24 PM

Did you paste the head portion in the head portion of the placeholder? And the body in the body section?

Do not paste the head or body tags.

**gwpriester** · 04 March 2018, 06:35 PM

Also, there are some variable in the script that need to be added, I saw gmail account. There might be more.

**Houdini** · 04 March 2018, 08:34 PM

your talking about the head and body in the place holder.

**gwpriester** · 04 March 2018, 09:01 PM

Yes.

**Houdini** · 05 March 2018, 04:42 PM

placed code in head and body, when i preview site the cousor turns to a finger like its a link but still not clickable etc

placed in the head

HTML Code:

 <meta name="google-signin-scope" content="profile email">
 <meta name="google-signin-client_id" content="***************************************.apps.googleusercontent.com">
 <script src="https://apis.google.com/js/platform.js" async defer></script>

placed in the body

HTML Code:

 <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"></div>
 <script>
  function onSignIn(googleUser) {
  // Useful data for your client-side scripts:
   var profile = googleUser.getBasicProfile();
   console.log("ID: " + profile.getId()); // Don't send this directly to your server!
   console.log('Full Name: ' + profile.getName());
   console.log('Given Name: ' + profile.getGivenName());
   console.log('Family Name: ' + profile.getFamilyName());
   console.log("Image URL: " + profile.getImageUrl());
   console.log("Email: " + profile.getEmail());
  // The ID token you need to pass to your backend:
    var id_token = googleUser.getAuthResponse().id_token;
    console.log("ID Token: " + id_token);
      };

**gwpriester** · 05 March 2018, 05:24 PM

Maybe Acorn or one of the other members who know more about coding than I do can help you with this.

**jamesd** · 05 March 2018, 08:12 PM

All the script is doing is console.log user data. This is just an example script how data can be retrieved from googles API. You would need to look at the docs to develop it further.

**Acorn** · 05 March 2018, 08:14 PM

Originally Posted by gwpriester

Maybe Acorn or one of the other members who know more about coding than I do can help you with this.

I went to the offered Google developers site and tried changing items from their suggestions but I couldn't get the OP's version or their's to present a button let along have a failed click. I also don't understand the synergy of using this with a Xara site. Does it allow a log-in to proceed? Xara sites don't support server code so I am confused and no help.

Acorn

**jamesd** · 05 March 2018, 08:23 PM

Originally Posted by Acorn

I went to the offered Google developers site and tried changing items from their suggestions but I couldn't get the OP's version or their's to present a button let along have a failed click. I also don't understand the synergy of using this with a Xara site. Does it allow a log-in to proceed? Xara sites don't support server code so I am confused and no help.

Acorn

The OP would have to write his own script to get the login to proceed.