Connect a Social Auth Provider

1. Create OAuth credentials in GitHub

Login to GitHub with an admin account for the organization you want to create an OAuth token for, then go to the organization settings page:

• Click your username in the top menubar, then
• click Your organizations in the drop down, then
• click on the organization name, then
• click Settings.

In the left side bar, towards the bottom, under Developer settngis, click OAuth Apps, then New OAuth app.

Under Homepage URL, enter the top level domain name for the application you created on DjaoDjin (It will have follow the pattern subdomain.djaoapp.com) or the custom whitelabel domain for the application if you set one.

Under Authorization callback URL, enter the URL of the top level domain name you entered previously with a /complete/github/ path suffix.

Homepage URL
https://subdomain.djaoapp.com

Authorization callback URL
https://subdomain.djaoapp.com/complete/github/

Then click Register application.

Note the Client ID and Client secret. You will need to enter them into the DjaoDjin control panel.

2. Copy the GitHub credentials to DjaoDjin control panel

Login to your DjaoDjin dashboard and browse to the application Control Panel. Click on Gate in the left sidebar, then Update under Social login.

Enter the GitHub Client ID and Client secret you copied previously from the GitHub console into their respective input field on the DjaoDjin control panel.

Click Update.

3. Add a "login with GitHub" button on your site

Login to your DjaoApp site as a broker profile manager, and enable the inline template editor tools (Click your username in the top menubar, then Settings > Themes > Show inline template editor tools).

Browse to the login page on your site (ex: by typing https://subdomain.djaoapp.com/login/ directly in the URL bar). Then click the HTML edit icon on the right side of the browser window.

Locate the spot in the accounts/login.html HTML theme template where you want to add a "login with GitHub" button and type standard HTML for a <a> link node, using /login/github/ as href.

<a href="/login/github/" class="btn btn-secondary" >Login with GitHub</a>

Reload the page to check the button appears, then Sign out, click Login, and on the login page click Login with GitHub. Follow the workflow to make sure you can login/sign-up with GitHub.

1. Create OAuth credentials in the Google Cloud Console

Login to your Google Cloud Console, then click on Credentials in the left side-bar.

At the top of the page, click on + CREATE CREDENTIALS, then OAuth client ID in the drop down.

Select Web Application for Application type. Set the Name you wish to remember those credentials by.

In the Authorized JavaScript origins, click + ADD URI, and enter the top level domain name for the application you created on DjaoDjin (It will have follow the pattern subdomain.djaoapp.com). If you have set a custom whitelabel domain for the application, add that URI as well.

In the Authorized redirect URIs, click + ADD URI, and enter the URL of the top level domain name you entered previously with a /complete/google-oauth2/ path suffix (repeat the process if you have set a a custom whitelabel domain for the application).

Application type
Web Application

Authorized JavaScript origins URIs
https://subdomain.djaoapp.com

Authorized redirect URIs
https://subdomain.djaoapp.com/complete/google-oauth2/

Then click Create.

Note the Client ID and Client secret that appear on the right side of the page.

2. Copy the Google credentials to DjaoDjin control panel

Login to your DjaoDjin dashboard and browse to the application Control Panel. Click on Gate in the left sidebar, then Update under Social login.

Enter the Google Client ID and Client secret you copied previously from the Google console into their respective input field on the DjaoDjin control panel.

Click Update.

3. Add a "login with Google" button on your site

Login to your DjaoApp site as a broker profile manager, and enable the inline template editor tools (Click your username in the top menubar, then Settings > Themes > Show inline template editor tools).

Browse to the login page on your site (ex: by typing https://subdomain.djaoapp.com/login/ directly in the URL bar). Then click the HTML edit icon on the right side of the browser window.

Locate the spot in the accounts/login.html HTML theme template where you want to add a "login with Google" button and type standard HTML for a <a> link node, using /login/google-oauth2/ as href.

<a href="/login/google-oauth2/" class="btn btn-secondary" >Login with Google</a>

Reload the page to check the button appears, then Sign out, click Login, and on the login page click Login with Google. Follow the workflow to make sure you can login/sign-up with Google.