Add Google login

Hello everyone, this is Julian from Memberstack, and I’m going to show you how to add Google sign-up to your site, like in this example. As you can see, if I click "Continue with Google," the Google sign-up window opens. So, let’s begin. First of all, you will need three things. Of course, you need your website on Webflow, as well as a registration form with a designed " Continue with Google" button. Next, you will need an app in Memberstack.

Just go to Memberstack.com and create an app. The steps are very simple. The entire process is fully guided . The next thing you will need is a project in Google Cloud. You need to find Google Developer Console in the search, it will be the first result where you will be asked to log in and then create an app. Here we are on this screen, let’s call it "test app". Leave everything as is and

click "Create" . Now that it’s done, we’ll be on a screen where there’s nothing useful for us yet. Let’s click on "OAuth Consent Screen". The next thing you need to do is select " External", like this, and click "Create" . Next, give it a name. Let’s just call it "test app". Or I’ll call it that, and you’d better choose another name. Choose your email address for support. Next, here you will be asked about the logo. And for the

authorized domain, be sure to specify Memberstack.com. Even if your domain is different, add Memberstack.com. Then, enter your email address in the developer’s contact information. So, done. After that, click "Save and continue." The next section is “ Scopes”, it sounds complicated, but don’t worry. Just click Add or Remove and select the first three options, like this. This is simply a list of what

you will share. Click " Update", everything is fine, and "Save and Continue" again. Test users, this is important during testing. I don’t need it right now, so I’ll click " Save and Continue." The result looks good. Now let’s go back to the control panel. So, here we are, and now we just need to get our credentials. So let’s do it now. So the next thing we’re going to do is go here to credentials and click "Create

Credentials." Then we will need to select the OAuth client ID, like this. And choose the type of our program. This is a web application. Any name you wish. Test web application, and for the authorized redirect URI. Click "Add" and then we’ll be left with this empty field. What we need to do is go to Memberstack and go into our settings. Then we have this

authentication providers button and we see Google. Let’s click Configure and copy this. Now that it’s copied, let’s go back here and paste it. Now click " Create". So, here is our client ID and client secret. You must keep them a secret. This is just for testing and it will be deleted in a second, so it doesn’t matter. So let’s copy this, go back to Memberstack, paste the client ID, paste the

client secret, and click Save . So, everything is ready, and the last thing you need to do is go to your Webflow site and find the button located on the registration form. If you don’t know how to create a Memberstack registration form, we have another video about it on the channel. The only thing you still need to do is select the link you placed on the registration form, click “ social authentication type,” and

then “Google.” That’s all . After that, you will have a fully working Google registration form on your website.