Set up Facebook Login
Nowadays, almost everyone has at least one personal Facebook account. By setting up Facebook login function in your store, your customers will be able to register or log in to your store with just one single click. This means they are approaching the next step - placing orders quicker.
Set up Facebook Login app
Customize authorization page ( optional )
Step 1 : Go to EasyStore Admin > Apps > More Apps > Search for Facebook Login and install
Step 2 : Skip the Authorization page and Customize authorization page, we will come back to them later on in step 2.
Step 3 : Scroll down to Settings and choose your preferred display settings > Save.
💡 Tips : If you wish the Facebook login button to appear on the top bar, make sure to select 'Top bar and login page'
Facebook login button at top bar only applicable in the following themes :
Mini Style
Adventure Camping
The Summer
Dreams Bedding
Happy Kitchen
Flower & Tea House
Prime, Homines
Hortus
WildHeart
Mensclub
Electron
Sweet Honey
Whale Book
Pastel
Crescendo
Espresso
Monday blue
Jim & Joe
Cyclops
Breezy
Stoneware
Hikari
Evolution
Petal
Bluepups
Wooden
Inspiration
DOUX
Aperture
Sprinkle
Radiant
Gents
North
Step 4 : Done.
📌 For new themes as below:-
Candy
X-FORCE
LUCKY
WAVE
MAKER
FALL
The Facebook login button would be available on the Login page
Step 1 : This step is needed only if you wish to customize the Authorization page.
Step 2 : To customize, you need to create a Facebook app ID and set up Facebook Login app at Facebook for Developers.
Step 3 : Go to Facebook for Developers and log in with your personal Facebook account > Click on My Apps at the top right
Step 4 : You will be directed to your Facebook developers page and click Create App
When you clicked on the Create app button, do select Consumer app type and click Continue
💡 Tips : Click here to know more about the app type
Step 5 : Insert your preferred
App Display Name
App Contact Email
Select Business Manager account (optional)
and click the Create app button > insert your Facebook account password.
Step 6 : Select Facebook Login > Set up.
Step 7 : Select Web at the pop up.
Step 8 : Go back to EasyStore Facebook Login app > Customize authorization page > Step 2 to copy Your Site URL.
Step 9 : Go back to Facebook for Developer > paste it under Site URL > Save > Continue ( Continue button would become clickable after Save button is clicked ).
Step 10 : Keep on clicking Next for all the upcoming tabs ( you need to click 3 times ).
Step 11 : Go to Facebook Login > Settings > make sure the followings are switched on.
Client OAuth Login
Web OAuth Login
Use Strict Mode for Redirect URIs
Step 12 : Go back to EasyStore Facebook Login app > Customize authorization page > Step 3 to copy the URL.
Step 13 : Go back to Facebook for Developer > Facebook Login > Settings tab > whitelist the URL under Valid OAuth Redirect URIs > Save changes.
Step 14 : Go to EasyStore Facebook Login app again > Customize authorization page > Step 5 to copy the User Data Deletion Callback URL.
Step 15: Paste the code in Deauthorize Callback URL column.
Step 16: Go to Settings > Basic and fill in as follows > Save changes.
Display Name: the name that displays on authorization page
Namespace: small letter for the Display Name input (suggestion)
App Domains: please keep the App Domains column empty.
Contact Email: your primary email address
Privacy Policy URL: insert your online store Privacy Policy URL
Terms of Service URL: insert your online store Terms of Service URL
App Icon: upload your business logo, only 1024 x 1024 dimension is accepted
Step 17 : Scroll down to the bottom under Website > make sure the Site URL are the same as in Step 8.
Step 18 : And do not forget to turn on your app at the top of the page.
Step 19 : Go to Settings > Basic and obtain your App ID and App Secret.
Step 20 : Go back to your EasyStore Facebook Login app > Customize authorization page > Step 5 to paste the App ID and App Secret > Save.
Step 21 : Done.
In this article:
Set up Facebook Login app
Customize authorization page ( optional )
1. Set up Facebook Login app
Step 1 : Go to EasyStore Admin > Apps > More Apps > Search for Facebook Login and install
Step 2 : Skip the Authorization page and Customize authorization page, we will come back to them later on in step 2.
Step 3 : Scroll down to Settings and choose your preferred display settings > Save.
💡 Tips : If you wish the Facebook login button to appear on the top bar, make sure to select 'Top bar and login page'
Facebook login button at top bar only applicable in the following themes :
Mini Style
Adventure Camping
The Summer
Dreams Bedding
Happy Kitchen
Flower & Tea House
Prime, Homines
Hortus
WildHeart
Mensclub
Electron
Sweet Honey
Whale Book
Pastel
Crescendo
Espresso
Monday blue
Jim & Joe
Cyclops
Breezy
Stoneware
Hikari
Evolution
Petal
Bluepups
Wooden
Inspiration
DOUX
Aperture
Sprinkle
Radiant
Gents
North
Step 4 : Done.
📌 For new themes as below:-
Candy
X-FORCE
LUCKY
WAVE
MAKER
FALL
The Facebook login button would be available on the Login page
2. Customize authorization page ( optional )
Step 1 : This step is needed only if you wish to customize the Authorization page.
Step 2 : To customize, you need to create a Facebook app ID and set up Facebook Login app at Facebook for Developers.
Step 3 : Go to Facebook for Developers and log in with your personal Facebook account > Click on My Apps at the top right
Step 4 : You will be directed to your Facebook developers page and click Create App
When you clicked on the Create app button, do select Consumer app type and click Continue
💡 Tips : Click here to know more about the app type
Step 5 : Insert your preferred
App Display Name
App Contact Email
Select Business Manager account (optional)
and click the Create app button > insert your Facebook account password.
Step 6 : Select Facebook Login > Set up.
Step 7 : Select Web at the pop up.
Step 8 : Go back to EasyStore Facebook Login app > Customize authorization page > Step 2 to copy Your Site URL.
Step 9 : Go back to Facebook for Developer > paste it under Site URL > Save > Continue ( Continue button would become clickable after Save button is clicked ).
Step 10 : Keep on clicking Next for all the upcoming tabs ( you need to click 3 times ).
Step 11 : Go to Facebook Login > Settings > make sure the followings are switched on.
Client OAuth Login
Web OAuth Login
Use Strict Mode for Redirect URIs
Step 12 : Go back to EasyStore Facebook Login app > Customize authorization page > Step 3 to copy the URL.
Step 13 : Go back to Facebook for Developer > Facebook Login > Settings tab > whitelist the URL under Valid OAuth Redirect URIs > Save changes.
Step 14 : Go to EasyStore Facebook Login app again > Customize authorization page > Step 5 to copy the User Data Deletion Callback URL.
Step 15: Paste the code in Deauthorize Callback URL column.
Step 16: Go to Settings > Basic and fill in as follows > Save changes.
Display Name: the name that displays on authorization page
Namespace: small letter for the Display Name input (suggestion)
App Domains: please keep the App Domains column empty.
Contact Email: your primary email address
Privacy Policy URL: insert your online store Privacy Policy URL
Terms of Service URL: insert your online store Terms of Service URL
App Icon: upload your business logo, only 1024 x 1024 dimension is accepted
Step 17 : Scroll down to the bottom under Website > make sure the Site URL are the same as in Step 8.
Step 18 : And do not forget to turn on your app at the top of the page.
Step 19 : Go to Settings > Basic and obtain your App ID and App Secret.
Step 20 : Go back to your EasyStore Facebook Login app > Customize authorization page > Step 5 to paste the App ID and App Secret > Save.
Step 21 : Done.
Updated on: 17/11/2023
Thank you!