I use the following code to authenticate a user on my website:
function handleCredentialResponse(response) {
console.log("Encoded JWT ID token: " + response.credential);
window.onload = function() {
google.accounts.id.initialize({
client_id: "XXXXXXX.apps.googleusercontent.com",
callback: handleCredentialResponse
});
google.accounts.id.renderButton(
document.getElementById("buttonDiv"),
{ theme: "outline", size: "large" }
);
<div id="buttonDiv"></div>
But I need to customize the button with the design of my site...
Is it possible to create my own button like this ?
<button type="button" onclick="googleLogin();">Connection with Google</button>
And with the onlick I can connect. I tested several variants but it does'nt work, the initialization does'nt happen...
how i can customize the button keeping the current code (or just modifying it a bit) ?
Do you have an idea ?
Okay, probably there is no other way to modify the button style other than using renderButton options or just simply CSS.
But there is another option, there is a 'second' API. Afaik, that JS API is considered outdated and Google wants you to use the second one.
So it's here about integrating it into an app, and here about customizing the button itself.