X hide

Magento Facebook Login Configuration

From Plumrocket Documentation

You are viewing:  Social-login-pro-icon-32.png  Social Login Pro

Facebook-icon.png Facebook (facebook.com)

Description: Facebook is a popular free social networking website that allows registered users to create profiles, upload photos and video, send messages and keep in touch with friends, family and colleagues. The site, which is available in 37 different languages.
Protocol OAuth 2
Returned Data UserId, name, email, gender, birthday, photo
Requires SSL? No


How to Configure Facebook API for Magento

In this article you will learn how to find your Facebook API in order to setup the Facebook Login functionality. Please follow the step-by-step instructions below.


Information Sign sm.png Step-by-Step action:
  1. Go to https://developers.facebook.com/, click on "Apps" and select "Add a New App".
  2. Enter the name of the Application.
  3. Specify your contact email.
  4. Press "Create App ID"


Facebook login new api1.jpg


Information Sign sm.png Step-by-Step action:
  1. Next, navigate to "Facebook Login" and press the "Set Up" button.


Facebook login new api2.jpg


Information Sign sm.png Step-by-Step action:
  1. Select "Web" from the offered platforms.


Facebook login new api3.jpg


Information Sign sm.png Step-by-Step action:
  1. Go to "Settings" and select "Basic" from the menu on the left-hand side.
  2. Enter your Contact Email.
  3. Make sure to indicate the domain name for your Facebook Login extension application in "yourdomain.com" format. Note: This field is obligatory to make the Facebook login working.
  4. Click on "+Add Platform" button.


Facebook login new api4.jpg


Information Sign sm.png Step-by-Step action:
  1. Select the "Website" icon.


Facebook login new api5.jpg


Information Sign sm.png Step-by-Step action:
  1. Input the website address into the "Site URL" field.
  2. Press the "Save Changes" button.


Facebook login new api6.jpg


Now you need to make sure your "Client OAuth Settings" are configured properly.


Information Sign sm.png Step-by-Step action:
  1. Go to "Facebook Login" section.
  2. Select the "Settings" tab.
  3. Indicate your "Valid OAuth Redirect URIs" for this application. This URL can be found in the "OAuth Redirect URI" field of your Admin Panel > Plumrocket > Social Login Pro (or Twitter&Facebook Login) > Facebook.
    Important: This URL should be running under the HTTPS protocol due to the Facebook's "Enforce HTTPS" setting enabled by default.
    This setting requires HTTPS for OAuth Redirects and pages getting access tokens with the JavaScript SDK. All new apps created as of March 2018 have this setting on by default and you should plan to migrate any existing apps to use only HTTPS URLs by March 2019. Most major cloud application hosts provide free and automatic configuration of TLS certificates for your applications. If you self-host your app or your hosting service doesn't offer HTTPS by default, you can obtain a free certificate for your domain(s) from Let's Encrypt.
  4. Press the "Save Changes" button.


Facebook login new api7.jpg


Information Sign sm.png Step-by-Step action:
  1. Click on "Basic" in the menu on the left-hand side.
  2. Copy the "App ID" to your clipboard.
  3. Make the "App Secret" appear by indicating your Facebook password, and copy the "App Secret" to your clipboard.


Facebook login new api8.jpg


How to Configure Facebook API for Magento - Public Mode

At this point, in order to make this app and all its live features to be available to the general public, you will need to set your application status to be "Public". Please follow the steps below.


Information Sign sm.png Step-by-Step action:
  1. Click on "App Review" section in the menu on the left-hand side.
  2. Select "Yes" for your application to become public.


Facebook login new api9.jpg


Facebook Integration in Magento Social Login Pro Extension

In this step you must update your Magento Social Login Pro Extension configuration. In your magento admin panel, go to "System" -> "Configuration" -> "Plumrocket Inc" -> "Social Login Pro" -> "Facebook" Tab.


Information Sign sm.png Step-by-Step action:
  1. Set "App ID".
  2. Set "App secret".


1-Configuring-tf login facebook v1.5.0.jpg


Facebook Integration in Social Login Pro Extension for Magento 2

In this step you must update your Magento 2 Social Login Pro Extension configuration. In your magento 2 admin panel, go to "Plumrocket" -> "Social Login Pro" -> "Facebook" Tab.

Information Sign sm.png Step-by-Step action:
  1. Set "App ID".
  2. Set "App secret".


9 facebook login magento 2 v1.jpg


Configuration of Facebook Magento Social Login and Magento 2 Social Login application is now completed.


Next Step > Return to Social Login Pro API Reference

Navigation