Droip lets you integrate Social Login into your website, giving your visitors the convenience of signing in with their preferred accounts instead of creating new credentials. 

Currently, Droip supports Google, Facebook, and Twitter login options.

1. Google Login

Step 1: Collect Google Client ID and Secret

To enable Google Login, you’ll first need to create a project in the Google Cloud Console and obtain your Client ID and Client Secret.

1. Go to the Google Cloud Console.
   
2. Sign in with your Google account.
   
3. Navigate to APIs & Services > Credentials.
   
4. Click Create Credentials → OAuth Client ID.
   
5. Under Application type, select Web Application.
   
6. Configure the OAuth consent screen if prompted (add app name, email, and authorized domain).
   

Add the following Redirect URI: https://yourdomain.com/wp-json/GoogleLogin/v1/Auth/google-login

 (Replace yourdomain.com with your actual website domain.)

7. Click Create and copy the generated Client ID and Client Secret.
   

Step 2: Configure Google Login in Droip

1. Open your site in the Droip Editor.
   
2. From the Left Panel, click on Apps.
   
3. Search for Google Login.
   
4. Right-click on it and select Configure.
   
5. Enter your Client ID and Client Secret.
   
6. Enter a Success URL (the page the user will be redirected to after successful login).
   
7. Click Save.
   

Step 3: Display Google Login on Your Site

You can only insert Google Login on the Login Page.

1. To create one, go to Pages > click + > select Login from the Utility Pages.
   
2. Customize the login form to match your website style.
   
3. Go to Apps, search Google Login, and click Insert.
   
4. The Google login option will now appear inside your login form.
5. Make sure to publish the page. 

Preview & Test Your Login Page

When customizing the login page with social login options, you won’t be able to see the Google Login option in the same browser where you’re logged into the Droip editor.

To preview and test your login form, open the page in an Incognito browsing window. This ensures you see the login flow as a real user would.

You can follow the similar process to set up register with Google. 

2. Facebook Login

Step 1: Collect Facebook App ID and Secret

1. Visit the Meta for Developers.
2. Log in with your Facebook account.
3. Click My Apps > Create App.
4. Enter your app name, contact email, and click Next.
5. For use cases, choose Other and click Next.

6. Choose Consumer as the app type and click Next. Enter your app name, contact email, and click Create App.

7. Then, select Facebook Login as the product, and go to Settings. Add the following Redirect URI: https://yourdomain.com/wp-json/GoogleLogin/v1/Auth/google-login  (Replace yourdomain.com with your actual website domain.)

8. From the left menu, go to App Settings > Basic.
   
9. Make sure you have the site URL added, the copy your App ID and App Secret.
   
10. Add your website domain under App Domains.
    
11. Save changes.

Step 2: Configure Facebook Login in Droip

1. Open the Droip Editor.
   
2. From the Left Panel, click Apps.
   
3. Search for Facebook Login.
   
4. Right-click → Configure.
   
5. Add your App ID and App Secret.

6. Enter a Success URL (the page the user will be redirected to after successful login).
7. Click Save.

Step 3: Display Facebook Login on Your Site

1. Make sure you have a Login Page created.
   
2. From Apps, insert Facebook Login inside the login form.
   
3. Customize the button style if needed.

Similarly, you won’t be able to preview the Facebook Login option in the same browser where you’re logged into the Droip editor.

To preview and test your login form, open the page in an Incognito browsing window. This ensures you see the login flow as a real user would.