LearnWorlds is making it possible to have your very own white-labeled branded Social Logins for Facebook, Linkedin, Twitter, Google, and Apple meaning that you can completely remove any mention of the LearnWorlds brand (e.g., LearnWorlds logo) on the Social Logins.
In this article, you will find a step-by-step guide to Whitelabel your school's Facebook Social Login.
Facebook Developer Account settings
In order to white label the Facebook social login of your LearnWorlds school you need to create & set up your Facebook Developer Account, and follow these steps:
1. Create a Facebook Developer Account. You will find all the steps on how to Register as a Facebook Developer in Facebook's guide here.
2. After you register as a Facebook Developer you can Create an App while logged into your Facebook developer account; you can select the Consumer app type.
3. Once you have completed the app creation flow, you will be redirected to the App Dashboard. Find the Facebook Login and click on Set up.
4. In the next panel Facebook Login → Quickstart, select the platform for this app on the Web.
5. Add your LearnWorlds school's URL.
6. In the Set Up the Facebook SDK for Javascript click on Next.
7. Move to the Facebook Login → Settings option in the navigation bar. In the Valid OAuth Redirect URIs add your LearnWorlds school's URL including the /f/signin/facebook (for example https://yourschoolname.com/f/signin/facebook) and click on Save Changes.
8. Go to Settings → Basic.
- In the Privacy Policy URL field add your LearnWorlds privacy page ( https://yourschoolname.com/privacy)
- In the Terms of Service URL field add your LearnWorlds terms page ( https://yourschoolname.com/terms)
- In the User data deletion field add https://yourschoolname.com/terms
- Choose a Category
- Upload your App icon (transparent logo in PNG format and 1024x1024)
Note: You can upload a JPG, GIF, or PNG file. The size of the image must be between 512 x 512 and 1024 x 1024 pixels. File size limit 5 MB.
9. Go to App Review→ Permissions and Features option in the navigation bar. Find the email and click on Get advance access.
Agree & Confirm advanced access for email.
10. Follow the same last step (above) for the public profile as well and agree & confirm advanced access for public_profile.
11. Now you are ready to set the App Mode: Development to live mode. This way you switch your app to live mode but you can switch it back to development mode, by setting the app status to off.
Note: You will then need to complete the Data Use Checkup for your app which will appear after some time under App Review→ Requests. This needs to be done regularly from time to time and you will be notified.
Go to Settings → Basic in your Developer Account to view and copy your App ID and App Secret.
Finalize the Whitelabeling Configuration in LearnWorlds
1. Navigate to your LearnWorlds school and click on Site Builder → Sign in/up → Social under Site Settings.
2. Add the App ID (Key) and Secret under Whitelabel Social Logins and click on Save.
