Social Login

Social Login addon allows students to log into the LMS with their Google or Facebook accounts for quick and secure access without needing to remember additional passwords.

Settings in Social Login Addon

The Social Login addon has these settings:

  • Social login position in authorization form: This setting allows you to choose where the social login buttons are displayed on the login form: on top or bottom.

  • Login via Google: You can allow login with a Google account. When you can enable this setting you need to provide the following details:

    • Client ID: The unique identifier assigned by Google to your application.

    • Client Secret: A secret key provided by Google to secure the application's communications.

    • Redirect URL: This is a redirect URL to copy and paste to the Authorized redirect URL in the Google API Console.

  • Login via Facebook: You can also allow users to log in using their Facebook account. To do this, you must configure:

    • App ID: The unique identifier for your application on Facebook.

    • App Secret: A secret code given by Facebook to protect your application's interactions.

    • Redirect URL: This is a redirect URL to copy and paste to the Authorized redirect URL in the Google API Console.

Setting up Login via Google

To enable login via Google for your users, you need to create and configure a Google App. The steps below guide you through this process. You can also read Google's documentation and set up a Google app.

Creating a Google App

  1. Visit the Google API Console and sign in with your Google account credentials if you haven't signed in.

  1. If you don't have a project, create one by clicking on "Select a Project" and "New Project". If you already have one, select your project from the top bar.

  1. Name your project and click "Create".

  1. On the left, click "OAuth consent screen".

  1. Select a User Type (choose "External" for public Google account login).

  1. Fill in the consent screen details:

  • App name (visible during consent) *required

  • User support email *required

  • Application homepage URL (e.g., https://yoursite.com)

  • Privacy policy and terms of service links

  • Add your domain under "Authorized domains"

  • Developer contact information *required

  1. Save and continue through the "Scopes" and "Test users" sections without changes.

  1. In the final Summary step, you will see all the details about the app.

  1. In "Credentials", select "+ Create Credentials" and choose "OAuth client ID".

  1. Select "Web application" as the Application type and name your OAuth client.

  1. Cope your authorized redirect URI from the addon settings, add it to the Authorized redirect URIs and click on "Create".

  1. After creation, note your "Client ID" and "Client Secret" from the modal or Credentials section. You need to save them to use later.

Publishing Your Google App

To make your app available to all users:

  1. Navigate to "OAuth consent screen" on the left.

  1. Click "PUBLISH APP" under "Publishing status".

  1. Confirm to publish your app.

After setting up your Google App, go to the Settings of the MasterStudy Social Login addon in your site's dashboard and input your "Client ID" and "Client Secret" accordingly.

That is how login will look with Login via Google enabled and set up:

Setting up Login via Facebook

To enable Facebook social login on your site through the MasterStudy Social Login addon, first, you have to create a Facebook App. This step-by-step guide will walk you through creating your Facebook App.

Important: From February 1, 2023, Facebook now requires businesses to complete a Business Verification to use the Facebook Login feature. This change means that only verified businesses can offer Facebook login on their websites. Individuals without Business Verification cannot use this feature. Find more information in Facebook's official announcement.

Creating a Facebook app

To obtain Advanced Access and expand your permissions, you must complete the Business Verification process. Begin this process by navigating to the "Verification" tab on the left side.

  1. Go to Facebook for Developers and go to Log in (Get Started - if you have logged into your Facebook account) on the right corner.

  1. Sign in using your Facebook credentials.

  1. You will be redirected to the Developers' app creation dashboard. Click Create app on the right.

  1. Choose "Other " for user case settings.

  1. Select Consumer for an app type.

  1. Fill in the fields for the app details and click on the Create app.

  1. Then you need to add a Facebook login to your app.

  1. Select the Web platform for your app.

  1. Enter the URL of your website.

  1. You can leave steps 2,3 and 4 without changes.

  1. In the final step of adding a Facebook login to your app, you can see all of Facebook's necessary documentation with guides.

  1. Go to the Settings of Facebook login.

  1. Copy the Redirect URL from the Social Login addon settings.

  1. Paste the URL into the "Valid OAuth redirect URIs" field in your Facebook App settings and save the changes.

If a blank page shows up after clicking on the "Save changes" button, simply refresh your browser to ensure the changes are saved.

  1. Ensure you enter a URL that links directly to your publicly accessible privacy policy in the "Privacy Policy URL" and "Terms of Services" fields in the Basic app settings.

  1. On the "Permissions and Features" section under App Review, find "public_profile" permission and choose "Request advanced access". Business verification is required to get the permission.

  1. Confirm advanced access for the public profile.

  1. Answer data handling questions and click Submit.

  1. Under the "Permissions and Features" section, locate the "Email" permission and select "Request advanced access". Business verification is required to get the permission.

  1. Confirm advanced access for email.

  1. Answer data handling questions and click Submit.

  1. Then confirm submitting the answers to the questions.

  1. You will get this popup after submitting it.

  1. Then you can change the mode of the app to Live. Turn the switch and click the Start checkup.

  1. Certify data use by clicking the box and continue.

  1. Certify compliance with Platform Terms and Developer Policies and continue.

  1. Click data use checkup for your app and click Submit.

  1. You have changed the app mode to Live.

  1. Next, go to the Basic App Settings and copy App Secret and App ID.

  1. Paste them to the following fields of the Social Login settings on your WordPress dashboard.

That is how the Facebook login enabled and set up will look:

Last updated