How to integrate the promotion with Facebook Login Follow
If you use your own Custom Domain for your Easypromos campaign and you want users to login with Facebook to offer an easy way to register, or you want users to share the promotion on Facebook, then you must use your own Facebook Application App.
To allow users to login with Facebook, users must accept permissions and authorize a Facebook application. The default application we use to login users is our default Easypromos Premium application. However our application doesn’t support your custom domain, so you have to create a new Facebook application to login users from your domain.
This is the warning message from Facebook when users try to login from your custom domain and you don’t use your application:
In this tutorial, we will explain step by step how to create your own Facebook application and connect it to your promotion with your custom domain.
The process takes about 15 minutes if this is your first time. The process is divided in 8 steps:
-
Create a new Facebook Application
-
Configure Facebook Login product
-
Set up Basic Settings
-
Switch to Advanced Level Permissions Public_Profile and Email
-
Data checkup process
-
Switch Facebook Application to Live mode
-
Connect Facebook Application to Easypromos promotions
-
Optional: Customize the icon of your application
What do you need before starting?
You will need to have these 2 URLs ready:
- Your privacy policy URL: You can use the URL of the privacy policy of your promotion, or the URL to the Privacy Policy of your website or business.
- REDIRECT URI: This is the URL that you will need to introduce for the configuration of the Facebook Application. You can obtain this URL from the screen of the Facebook Oauth Integration of your promotion:
The REDIRECT URI will always have the following format:
- If your custom domain is: https://promo.mydomain.com
- Then the REDIRECT URI is: https://promo.mydomain.com/utils/social/facebook
Step by step instructions
Here are the 7 steps you need to follow to create the app:
Step 1. Create a new Facebook Developers Application
1.1 Go to https://developers.facebook.com
To create the application, you need to have a Facebook developer account. If you don’t have one yet, you’ll be required to create it.
1.2 Go to MyApps
1.3 Create a new App
1.4 Select the App type: Consumer
1.5 Insert a Name to the App and a Contact Email.
This is the name of the Facebook Application that participants will see when they are login in the promotion with Facebook login. When logging in, the Facebook permissions popup will open. They will need to accept the permissions for this App you are creating.
Important: Please insert a valid contact email that you check daily. Facebook can review all applications at any time. The way you will use the App with Easypromos complies 100% with Facebook's guidelines, but for security reasons Facebook carries out routine security checks periodically and may request more information about you or your application. They will contact you through this email and will wait for a response from you through this email.
Step 2. Configure Facebook Login Product
2.1 Add Facebook Login as a Product and start the setup process.
2.2 Select WEB as platform for the Login setup, and insert your custom domain as the URL of your site and save:
2.3 Click on “Settings” for Facebook Login Product in the left hand menu:
2.4 In Facebook Login settings, do the following 2 edits then Save settings:
- Switch the option “Login with the Javascript SDK” to YES
- Insert your custom domain in the “Allowed domains for the Javascript SDK”
Step 3. Set up Basic Settings
3.1 Prepare BASIC Settings for your application. Go to Settings > Basic, and update the following fields:
- App domain: insert your CUSTOM DOMAIN
- Privacy Policy URL>: insert your Privacy Policy URL.
- User Data Deletion Instructions URL: insert your Privacy Policy URL
When you have filled out these 3 fields, make sure you click and Save Changes.
Step 4. Switch to Advanced Level Permissions Public_Profile and Email
In this step we will switch the access level for permissions Public_Profile and Email from the Standard Access to Advanced Access.
4.1 Go to App Review > Permissions and Features:
4.2 Click on “Not now” if you see a popup like this when you access to Permissions and Features page:
4.3 Change level access for Public_Profile permission: Search the permission and click on “Get advanced access”:
Read the message and accept the checkbox and confirm (Facebook can request to insert your password again):
4.4 Change level access for Email permission. Search the permission and click on “Get advanced access”:
Read the message and accept the checkbox and confirm (Facebook can request to insert your password again):
After these steps, the permissions and features page, will be as follow:
You’re almost done!
Step 5. Data Use Checkup
The next step is to complete the Data Use Checkup. This is a necessary step from Facebook before you make your application live. The Data Use Checkup will commit you to comply with the allowed usage of the permissions and that you will follow the Facebook Platform policy.
5.1 To start the process click on the button “Get Started”, from the blue alert:
5.2 You will be prompted to pass the Data Use Checkup. Click on Start Checkup
5.3 Click on Get Started:
5.4 Read and accept the allowed usage of the permissions Public_Profile and Email. Click on Continue:
5.5 Next step is to read and accept the Facebook Platform terms and the Developer policy:
5.6 Finally “Submit” to Facebook the new app, to make it live:
Step 6. Switch Facebook Application to Live mode
6.1 Switch the App Mode from Development to Live:
6.2 Note/copy your App ID and App Secret, you will need it for the next step. You’ll find them in Settings > Basic:
Step 7. Connect Facebook Application to Easypromos promotions
7.1 Go to your Easypromos promotions Management page, and click on “Integrations” > “Facebook Auth Login”:
7.2 You could be required to login with Facebook.
7.3 Apply the following changes and SAVE:
- Insert your Facebook App ID.
- Insert your Facebook App Secret.
You’re done!
TEST YOUR INTEGRATION
To test that your Facebook application works correctly, please try to login with Facebook in your campaign using your custom domain. You should see the screen with the permissions with your application name:
Step 8. Customize the icon of your application
Optionally, to upload and/or change the icon of your application, which is displayed when requesting permissions, you should access the Facebook Developers area:
8.1. Choose the application that interests you:
8.2. Go to Settings> Basic information in the menu on the left:
8.3. You'll be able to customize the 1024x1024 pixels App Icon. To upload the image, hover above the enabled checkbox until you see the pencil icon. Click here and a pop-up window will enable you to load the image. Save the changes before leaving the page. This image will be used when showing the application’s permissions request page:
8.4. The name that accompanies the permissions icon (in the previous example – "Snow Contest") is the name of the application or “Display name.” When creating the application in Facebook Developers you must have already entered a name. You can modify it at any moment from the “Configuration” section. Save the changes before leaving the page.
The image and name of the app used to present the application are not customized here, but rather in the promotion administration panel when you have linked the application with Easypromos.
Comments
0 comments
Article is closed for comments.