Facebook Login

The Facebook Login is a really easy way to register for your customers, also it can guide your Facebook page a get a lot of likes!

Due to this use your own Facebook, we recommend that you make the configuration, in the end, this is your business, but do not worry, here you can find an easy way to do it by yourself!.

Configure your Facebook Developer Account

To configure you need to create an account, in https://developers.facebook.com/

Once you have an account you need to find the "My Apps" option in the top of the page, click it and  then click in the "Create App":

 

Then you need to select the "Consumer" option and then click to continue. 

 

• Type the name of your app in the "App Display Name" field.
• Also verify that the email that shows is correct of your account in the "App Contact Email".
• In the "Do you have a business Manager Account?" you can select "No Business Manager Account selected" that is up to you.
• And then just click in the "Create App" button:

 

 

Then you need to go to "Settings" option in the left panel and click in the "Basic" option. Just fill up the requested information:  

 

Please fill up these fields using this information:

• Display Name: This is the name of your Ordering App. 
• Namespace: Type the name of your app just "withoutspacesandcapiltalletters".
• App Domains: Please type this:
  • localhost
  • http//yourdomain.ordering.co/. Please in the second one use your custom domain like this

Recommendation: type the URL, instead of copy and paste

• Contact Email: Your email for contact.
  Privacy Policy: You need to type the URL of your privacy policy URL, other way this won't be working. 
• Terms of Service URL: You need to type the URL of your Terms of Service, if you don't have, please create one in the Static pages manager from your Ordering Website.
• User Data Deletion: You need to select one of the two option, Data Deletion Instructions URL (recommended) or Data Deletion Callback URL (if you have it).  We strongly recommend to implement a new page with the data deletion instruction and type the URL of it. 
• App Icon: Upload your App Icon.
• Category: Select the category that suits to your project. 
• App Purpose: Select the one that suits to your project (we recommend clients).
  
  

The next information you need to fill up is the "Data Protection Officer Contact Information" 

Is not necessary to explain these fields, they are just personal information. Please fill them for your security.

In order to Add Website facebook login,

Click on "+ Add Platform" and select "Website" option. Then just click in the "Next" button. 

 

On the "Site URL" paste your custom domain, like "https://www.ordering.co/" and click on the "Save Changes" button.

In order to Add iOS App,

Click on "+Add Platform" and select "iOS" option. Then just click in the "Next" button. 

Then this information will appear, you just need to fill up the "Bundle ID" option. Please copy and paste the package bundle of your Ordering App, if you don't know it, please have a look into your builder, is on the Settings section, under the name "Package*"

In order to Add Android App,

Click on "+ Add Platform" and select "Android" option. Then just click in the "Next" button. 

Then select Google Play, and click on the "Next" button

 

 

Then just fill up these fields:

• Package names: Is the same case of the iOS, use the package bundle. Example: com.orderingapp.ordering
• Class Name: Type this: com.facebook.loginactivity
• Key Hashes: Please copy and paste these 5 key hashes: 

P06REiEMufbvSOrQ76OaICh4L50=
TwtQwSSbQbitJBrpdPuZwp56eaA=
KNhJ+X6VJU/FVwXiAV3fs1KGC7c=
wwaw8MEJvRZJY0UDqH1D5hg97ns=
nQDiV5o9r4uzoIMvN/xzEDi1QF4=

 

Leave active only the "Log In-App Events Automatically (Recommended)". This should look like this: 

 

Once you have Saved the changes. You can go to the "Add product" in the left panel. And then click into the Facebook Login option "Set up":

 

Then select the "Settings" option in the left panel, please do not click on Quickstart:

 

It necessary to deactivate and activate few options:

• Deactivate the "Force Web OAuth Login"
• Activate the "embedded Browser OAuth Login"  

On the "Valid OAuth redirect URIs" section, have to use these texts below:

• https://localhost:8100/oauthcallback.html
• https://"YOUR_DOMAIN"/oauthcallback.html
• Your Domain example: https://www.ordering.co/

Get the App on Live Mode: 

 

Attention: To be able to do this step (enable FB Login on Live Mode) first the app should be live on the stores (Play Store - App Store).

 

Recommendations:

• Setup FB Login on Developer Mode (uses tests credentials to check that it works) and upload the apps on the stores.
• Setup FB Login only on the website to enable the Live Mode and later when the app is live on the stores, finish the app setup and add the FB Login ID on the Ordering App (this means that is necessary to upload a new app version)

 

To complete the configuration about Facebook login only need to publish your app, please switch from Development move to live mode: 

 

A popup message will/may appear, just click on "Use the name of this package" button to continue with the configuration.

 

Finally, go to your builder (my.ordering.co)

Write your App ID to finish your settings in the Facebook ID space, there's necessary to do this in the Builder and the Ordering App products. 

 

Also, be sure that the Facebook_app_name is the same as the one in the Facebook Developer Account. After this, you need to rebuild your Website/OrderingApp to see this extension working.

 

Then in your website, go to the settings screen (Admin Area > More > Settings) and selects the "Facebook Setting" to complete the configuration to your Facebook login.

 

In this section, paste the "App ID" into the "Facebook Id" field & the "App Secret" in the "Facebook Secret" field, and click on SAVE button to apply the changes.