---
title: "How to Add a Facebook Login to WordPress with Elementor?"
url: https://theplusaddons.com/docs/add-a-facebook-login-to-wordpress-with-elementor/
date: 2024-05-16
modified: 2026-04-09
lang: en
author: "Aditya Sharma"
description: "Are you looking to add a Facebook login to your Elementor website? Adding a Facebook login feature to your Elementor website can greatly enhance user experience and improve engagement by..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/image-42-1024x536.png
word_count: 682
---

# How to Add a Facebook Login to WordPress with Elementor?

## 

- Integrates Facebook Login into Elementor websites using The Plus Addons for Elementor's WP Login & Register widget.
- Generates Facebook App ID and App Secret through Facebook for Developers by creating a new app.
- Configures Facebook Login settings by adding the app's Privacy Policy URL and enabling Live mode.
- Enables Facebook login in the WP Login & Register widget by adjusting form settings and toggling social login options.

Are you looking to add a Facebook login to your Elementor website? Adding a Facebook login feature to your Elementor website can greatly enhance user experience and improve engagement by simplifying the login process.

With the WP Login & Register widget from The Plus Addons for Elementor, you can easily add a Google login to your Elementor website.

*To check the complete feature overview documentation of The Plus Addons for Elementor WP Login & Register widget, [click here](https://theplusaddons.com/docs/create-a-login-register-form-in-elementor/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-login-form/)

First, you have to generate your **Facebook App Id **and** Facebook App Secret**.

### Generate Facebook App ID and App Secret

1. For this, you have to login to your Facebook account and go to [Facebook for Developers](https://developers.facebook.com/).

2. If you don’t have a developers account, click the **Get Started** button at the top.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Generate-Facebook-App-ID-and-App-Secret.png)

3. Then you have to register for a developer account, follow the steps to create your account.

![](https://theplusaddons.com/wp-content/uploads/2024/05/create-Meta-Developers-Account.png)

4. Once done, you’ll get to the Apps page, click on the **Create App** button. 

![](https://theplusaddons.com/wp-content/uploads/2024/05/Create-App.png)

5. On the next screen, you have to select your app type, select **None** and click on **Next**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Select-App-type.png)

6. Then add an app name, email id and optionally connect your business account. Once done click on **Create App** button.

![](https://theplusaddons.com/wp-content/uploads/2024/05/App-Details.png)

7. On the next page, from the left sidebar, click on **Settings** > **Basic**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Basic-Settings.png)

8. Now you’ll find your App Id and Secret, click on the **Show** button in the **App secret** field to see the secret key. 

Copy and paste both App Id and Secret into a notepad. You’ll need it later. You need to perform a few more steps before you can use them. 

![](https://theplusaddons.com/wp-content/uploads/2024/05/App-Id-and-App-secret.png)

9. Now you need to make the app live. In order to do so, you’ll have to add a **Privacy Policy URL**.

You can add your website URL or privacy policy page URL. Then from the **Category** dropdown you have to select a category for your app.

Once done click on **Save changes** button.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Select-app-category.png)

10. Then from the top, turn on the **App Mode** toggle to **Live**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/App-Mode.png)

11. Now click on the **Add Product** link in the left sidebar.

12. On the next page, click the **Set up** button in the **Facebook Login**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Click-Set-up-button.png)

13. This will add a **Facebook Login** link in the left sidebar. Go to **Facebook Login** > **Settings**.

14. On the next page, in the **Valid OAuth Redirect URIs** field add the page URL where you have added the Login & Signup block.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Valid-OAuth-Redirect-URIs.png)

15. Then turn on the **Login with JavaScript SDK** toggle to **Yes,** and in the **Allowed Domains for the JavaScript SDK** field, add your website URL. Then click on the **Save changes** button.

![](https://theplusaddons.com/wp-content/uploads/2024/05/Login-with-JavaScript-SDK.png)

### Add the Facebook App ID and Facebook App Secret in The Plus Addons for Elementor

Once you have your Facebook App ID and App Secret, go to

- **The Plus Addons **→** Extra Options → Settings** 

- Scroll down to the **Login with Facebook **section then click on the Setting Icon and you can see the Login with Facebook popup section**. **

- Then in the Popup section paste your Facebook **App ID **and **App Secret ID** and click on **Save**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/login-register-facebook-id-settings.gif)

### Enable Facebook Login in the WP Login & Register widget

Add the WP Login & Register widget on the page and follow the steps - 

1. Select the appropriate form type (except Forgot Password) from the **Type** dropdown under the **Forms Layout** tab.

2. Then enable the **Facebook** toggle from the **Social Login/Register** tab.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-facebook-login.png)

You can select a button layout from the **Layout** dropdown. 

From the **Alignment,** you can align the button in the form.

Then in the **Redirect URL** field, you can add a page link to redirect users to a specific page after login.

By enabling the **Hide Form** toggle, you can hide the manual form and only keep the Facebook login button.

This is how easily you can add a Facebook login option to your Elementor website.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-facebook-login-demo.png)

***Suggested Reading***: [*How to Add a Google Login to WordPress with Elementor?*](https://theplusaddons.com/docs//add-a-google-login-to-wordpress-with-elementor/)