How to Setup Facebook Login.

Note: Facebook updates their login app frequently - if this documentation is out of date please email zach@commerce7.com. 

To get started, first click this link.
https://developers.facebook.com/apps/

This will take you to the Facebook for developers site. Follow the steps to connect your account then click “Add a New App”.

 

add app

Next, select "For Everything Else"

FB

Enter a display name, (it doesn’t matter what you enter in this field). Then enter a contact email. This should be an email address you check regularly. Click create app ID when you've entered your information.

alicias test

 

Scroll down and click "Set Up" in the Facebook Login box. 

 

set up facebook

Next, click "Web"

 

In Step 1: enter the URL of your front end site.

addwebsite

 

If you don’t know what your URL is, go to your admin panel and click the Settings tab > General Settings and copy the Website URL

site

Copy the URL on this site and paste it into the "Site URL" field back on the Facebook for developers site.

In Step 1: Save and hit continue.

saveand continue

Step 2: Click "Next".

2 next

Step 3: Scroll down and click "Next" again.

3 next-1

Step 4: Click "Next" again.

step 4 next

Step 5: Scroll to the top of the screen and click on your "App ID" to copy it.  

app id

Go to your Commerce7 admin panel, and click "Apps". Click on the "Facebook Login" app. 

apps

Paste the "App ID" from your Facebook for developers site in the App ID field. Switch the app to "active" and click save. 

app id-1

Go back over to the Facebook for developers site, and click on the "off" button. 

 

onoff

Click on the "Basic Settings" link. 

basic

In the privacy policy field, add the URL of your website with a "/legal" at the end. Then click "save changes".

legaland save

Click the "off" button again.

 

on off

Choose a category of "Business and Pages" and click "switch mode". 

business

Your Facebook Login is now setup! Test it out by going to your URL /profile/login page and selecting the Continue with Facebook tab. 

fb on front end