For Social Login to work on your site, you need to set up a dedicated Application in each of the social networks you wish to use as a Social Login provider .
1) Create your Facebook App
Below you can find step-by-step instructions to set up and configure an Application for Facebook.
Step 1: Create a new Facebook App
- Login to your Facebook Account.
- Go to Facebook Developers’ page.
- In the top right Menu, click on “My Apps” and select “Add a New App”.
4. In the Create a New App ID popup:
- Enter a Display Name for your new App (This will be visible to visitors through the Facebook login flow, so please make sure that you give a name that is indicative of your business).
- Enter your Contact Email address.
- When you are done, click on “Create App ID”.
Make sure you review the “Facebook Platform Policies” here.
Step 2: Configure your new App
1. In the “Select a Scenario” page, click on “Integrate Facebook Login” and click “Confirm” on the bottom right of your screen.
2. Now you will be redirected to the “Basic Settings” tab of your App.
- Enter your Privacy Policy and Terms of Service URLs.
- Upload an App Icon that will be displayed in the Login Flow (eg. your Logo). Accepted characteristics: Dimensions: 1024x1024px or 512x512px, transparent images only, accepted file formats: JPG, GIF, or PNG and file size shall not exceed 5MB.
- Chose a category for your App.
- Choose the Business Use for your Facebook App.
- Scroll further down in the “Basic Settings” tab and click on the “Add Platform” at the bottom of the page to add your website.
- In the pop-up click on the “Website” icon.
- Enter your website URL.
- Click on “Save Changes” when you are done.
5. From the left-hand menu click on the “Advanced” Tab of Settings.
- Set App Restrictions as you require.
- Keep the version of the app because you will need it later for the process.
- Click on “Save Changes” when you are done.
Step 3: Configure Facebook login
1. From your left-handed menu, click on “Facebook Login” and select “Settings”.
2. Enter the following URL
https://plugin.socital.com/api/v1/auth/callback
in the “Valid OAuth redirect URIs” field and click on “Save Changes”.
Step 4: Bring your Facebook App into Live status
1. Locate the status bar on the top menu of your Facebook App.
2. Click on it to bring your App into live status.
3. In the pop-up that will appear, please click “Confirm”.
2) Connect your Facebook App with your Socital Account
To allow Socital to connect to Facebook on your behalf, to extract User Data, authenticate users and offer its other services to you, you need to connect to your Socital Account the Facebook App which you are using for Facebook Login.
Step 1 Get your Facebook App ID and App Secret
- Go to Facebook Developers’ Platform.
- Login with your Facebook Account.
3. From the “My Apps” drop-down menu in the top right corner, choose the App you would like to connect to your Socital Account.
4. In your App’s Basic Settings, you can see the App ID and App Secret.
Note: In order to display the App Secret you need to click on the “Show” button and might be prompted to enter your Facebook password for security reasons.
Step 2 Add your Facebook App ID and App Secret to your Socital Account
5. Login to your Socital Dashboard.
6. Open the drop-down menu in the top right corner and choose “Account Settings”.
7. From the left-hand menu open the “Connect Social Apps” tab.
8. Click on “Connect a Facebook Application”.
9. In the pop-up enter your Facebook App ID in the “Application Key field”, your Facebook App Secret in the “Application Secret field” and the Application API version. Then click on “Connect”.
10. You should see a Success message in the popup.
11. You can now see the connected Facebook App in the list of your Connected Social Media Apps.