Comment on page
Sign in with Google
How to Add Google Sign-In with Your Adalo App
Skill Level: Expert
- Paid plan may be required to use in Native or with Xano External Collections.
Google Dev Setup
1.) Click the plus button
in the left toolbar in Adalo
2.) Scroll down and click the Explore Marketplace button
3.) In the Marketplace, scroll to find the Sign in with Google component and click Install
4.) Click the plus button in the left toolbar in Adalo
5.) Search for the Sign in with Google component
6.) Drag the component on to your Sign In screen (and do the same for your Login screen). We'll finish setting it up in just a minute.
8.) Select your project or create a new project (if you don't already have one)
If you don't already have a project you'll have to create a new one
9.) Choose whether your app is Internal (just for people within your organization) or External/Public (for users outside of your organization)
If you choose External you will see a message about Google needing to review your app. Google will not need to review your app if you don't include a custom logo on your consent screen.
10.) Enter your app's information, then click Continue
- App Name
- Support Email Address
- App Logo (Optional) - 🚨if you upload a logo your app will need to be reviewed & verified (this will take longer for you to be able to use Google Sign-in )🚨
- The home page of your app's website
- URL of your app's terms of service
- Authorized Domains (include the same domain as your app's website)
- Developer Contact Information
11.) Click the Add or Remove Scopes button and select on the first 3 scopes
12.) Scroll down click the Update button. Then scroll down and click the Save and Continue button.
13.) Skip entering any Optional Info
14.) On the Summary step, scroll down and click the Back to Dashboard button. You should see a message stating "Verification not required"
Your consent screen is in Testing mode by default. Only your Google Developer account and testers will have access to use Sign In with Google until you click the Publish button on this Dashboard. You can toggle between testing and production at any time.
16.) Click the Create Credentials button
17.) Choose the OAuth Client ID option
18.) Select Web Application as the application type and enter an internal name for your web client ID (this can be anything)
20.) Copy the Client ID and paste it into the Client ID input of the Google Sign-in component.
22.) Click the Create Credentials button, then choose the OAuth Client ID option
23.) Select iOS as the application type, enter your iOS bundle ID, and click Create (if you haven't created your iOS bundle yet here's a help think for that — note that you can still test it on web and PWA as long as you've finished the Web Client ID step from above)
24.) Copy the Client ID and paste it in to the left panel in Adalo when you have the Sign in with Google component selected.
27.) Click the Create Credentials button and choose the OAuth Client ID option
28.) Pick Android from the Application type dropdown, then enter the name of your app in the Name field.
29.) For the package name enter in your bundle ID from the publish settings that you created while setting up your Android APK (if you haven't done that yet you can still test it on the web and PWA if you've created your Web Client ID — here's the help link for creating your Android app if you haven't done that yet)
30.) For the Fingerprint, which one you use depends on the build of your app. See the table below for instructions for each build type.
APK File from Adalo App
APK File from Elsewhere
Occurrence: Most Common
Use this method if your Adalo App build is:
2.) Under the Setup dropdown in the left menu, select the App Integrity option
3.) Copy the SHA-1 Fingerprint and paste it into the Fingerprint field of your Android Client ID setup.
Occurrence: Somewhat Common
Use this method if your Adalo App:
31.) Then click Create. Note that you won't need to paste this into Adalo, you just have to have it created for your Google Sign In to work on Android.
- If you're developing an app just for internal use at your organization, you can choose to restrict logins to only people within your organization by entering the domain of your organization's email address.
- You can customize the appearance of the button itself
- When users click the button, they will be either signed up for a new account with your app or log in to their existing account. You can add additional actions to the button such as linking the users to the home screen of your app.