Social Login: Facebook App Setup

Overview

This document provides instructions on properly setting up a Facebook application so that users can log in/register via Facebook on your site. You will need to purchase the social login extension if you want users to log in via Facebook.

Creating a new app

You need to create a Facebook app to allow users to log in to your site with their Facebook account. To create a new Facebook app, please do the following:

Go to the Facebook Developers site: https://developers.facebook.com/.
If you are not logged in, log in to the site using your Facebook account details.
Once logged in, go to 'My Apps'.
Click on the 'Create App' button. It will lead you to the app creations page.

A message will appear that there's a new way to create apps with Meta, click the ' Create App' button to continue.

Create an App

On this page, in the Add use case tab, select "Authenticate and request data from users with Facebook Login" from the suggested use case , and then click on the 'Next' button.
In the Login type tab, select "No, I'm not building a game" as your login type, so you will not be redirected to the gaming setup, then click the 'Next' button to proceed.
Fill out the App Name and App Contact Email. Then click the Create App button.

Note: After clicking the 'Create App' button, you may be presented with a security check.
Upon successful creation, a message window will appear that your app has been created. Click the 'Go to Dashboard' button to proceed to the dashboard.

Create and Publish app

Customize this app

In the dashboard, click on the 'Customize adding a Facebook Login button' to set up your product.
Scroll down to the Permissions section and add 'public_profile' and 'email' permissions by clicking on the 'Add' button.
After you have added the permissions, go to settings by clicking on the 'Go to settings' button.
In the Client OAuth Settings, you need to enter your site's login, register, and account's social tab URIs into the field "Valid OAuth redirect URIs." Add the custom page URL if you use the social login shortcode on the custom page. We recommend adding additional URLs with the parameters "return_provider" and "provider" See the example below:
After you have saved the changes, go back to Customize and click on 'Go to quickstart'
Select the Web platform for your app, then add your Site URL, then click the "Save" button.

Prepare and submit for App Review

Note: Additional steps may be necessary. Ensure that all required verifications and data handling questions, if applicable, are completed before submitting this application to App Review. If you do not have a Facebook business account, please follow the instructions provided here on how to create one: https://www.facebook.com/business/help/1710077379203657.

In the Prepare and submit for App Review, click on 'Review and complete testing requirements', it will redirect you to Graph API Explorer.
On the right section of the Graph API explorer add the public_profile and email. To add a permission go to permission > User data permissions> email.
Once added, click on Generate Access Token and Submit buttons,
Go back to your App's Dashboard, and click on Business Verification, it will redirect you to the verification page. This is where you can add your business account.
This step is necessary to obtain access to user data, commonly referred to as advanced access in certain applications. Completion of this process is restricted to individuals with full control of a Business Account. For further information on business verification, please refer to this article: https://www.facebook.com/business/help/2058515294227817?id=180505742745347
Once, you have successfully added a verified business account. Return to the App Dashboard or from the side menu, click on Review>Data handling questions. It will redirect you to data handling questions where you need to answer questions about data handling.
To begin, select "Answer questions about data handling," and a window will promptly appear. Within the Usage Check tab, carefully review and confirm the data usage permissions and features you have added. Utilize the checkboxes to express your confirmation and agreement, and subsequently, click on the confirm button to proceed.
Now in the Data Handling tab, In order to obtain access to permissions, kindly provide information regarding your data handling practices. This is a mandatory step for App Review and the subsequent launch of your app. Answer the questions and click Submit button.

Publish

Go to the Publish tab from the side navigation menu. Then click on the 'Go to app settings'.
You must fill in the following information: Privacy Policy URL, Terms of Service URL, User data deletion and you can also include an app icon to make the app appear more professional. Then click the 'Save changes' button.
Ensure all required settings are completed and use cases are reviewed before you click on the 'Publish' button, the app can’t be published if the requirements are incomplete.
Note: After clicking the 'Publish' button, you may be presented with a security check.
After successfully publishing your app, a confirmation message will be displayed indicating that it is now available for the public to use. To proceed to the next step, simply click the 'Done' button.

App ID & App secret

With your app successfully published, the next step is to integrate Facebook with Ultimate Member. To achieve this, you'll need both the App ID and App Secret.

In the side navigation menu, navigate t o App settings > Basic. Here, you'll find both the App ID and App Secret.
Copy the App ID and App Secret, then proceed to wp-admin > Ultimate Member > Settings > Extensions > Social Login > Facebook Social Connect. Paste the copied values into the respective fields and finalize the process by clicking the 'Save Changes' button.

Test Integration

If you enabled the settings listed below, Facebook buttons will be integrated into your site's account page,registration page, login page.

Social Account Tab

Show social connect on registration form

Show social connect on login forms