Facebook Login

Instructions on setting up Facebook Login on your website for convenient login for customers.

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

Facebook updates their login app frequently. We apologize if this documentation is out of date and please contact support@commerce7.com

This will take you to the Facebook for developers site. Follow the steps to connect your account then click Create App

All-Apps-Facebook-for-Developers

Next, select Build Connected Experiences

All-Apps-Facebook-for-Developers (1)

Next, enter the fields; 

  • App Display Name - his is the app name associated with your app ID.
  • App Contact Email - this email address is used to contact you about potential policy violations, app restrictions or steps to recover the app if it's been deleted or compromised.
  • Select No Business Manager Account selected with the drop down menu
When you are finished, select Create App

All-Apps-Facebook-for-Developers (2)

On the next screen select Set Up under the Facebook Login square.

Spectra-Winery-Login-Add-Product-Facebook-for-Developers

Next, select Web

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers

In Step 1 you will need to enter the site URL. 

To get your website URL from the admin panel, navigate to Settings > General and copy and paste the Website URL into the Site URL field for the Facebook Login app.

Commerce7-Settings (7)

Once you have entered the Site URL to the field, select Save and Continue

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (1)

On Step 2, select Next

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (3)

On Step 3 scroll down to select Next again. 

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (4)

On Step 4 select Next again. 

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (5)

From Step 5 at the top of the screen Click to Copy the App ID by scrolling over the App ID number

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (6)

Now, go back to Commerce7 admin panel and select the Apps & Extensions tab. Scroll down to the Commerce7 Extensions section and select the Facebook Login app. 

Commerce7-Apps (6)

Next, paste the App ID from your Facebook for developers site in the App ID field and then use the drop down menu to switch the app to Active and then select Save

Commerce7-Apps (7)

Next, go back over to the Facebook for developers site and toggle the In Development option the right 

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (7)

Then, select from the pop up window select Basic Settings link. 

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (8)

On this page, in the Privacy Policy URL field enter your website URL and add "/legal" at the end.

Under the Category section use the drop down menu to select Business and Pages 

Spectra-Winery-Login

Once you select Save Changes it will remain on this page and then toggle the In App Development to the right again 

Spectra-Winery-Login-Facebook-Login-Facebook-for-Developers (7)-1

This time select Update on the pop up window

Spectra-Winery-Login (1)

Your Facebook Login is now setup!

Test it out by going to your URL Account Login page and select the Continue with Facebook tab to ensure it is functioning properly. 

fb on front end