Social login via Facebook API – PrestaShop module
35$
Video:
https://youtu.be/UFtdFu59nT8
Download documentation
Social login via Facebook API.pdf
Compatibility
PrestaShop 1.7 – 8.x
Goal
Allows you to login and authorise in PrestaShop using Facebook account. Besides you can connect your Facebook account to the existing account in PrestaShop.
Benefits for Merchants
- simplifies users’ registration on your site;
- increases the conversion of registrations on the site;
- popularize and promote your store in Facebook due to the ease of authorisation;
- users’ base growth due to the simplicity of registration;
- higher conversion of orders due to the fast creation of the account on the site via Facebook.
Benefits for customers
- no need to enter personal data and passwords;
- fast orders proceeding – no need to spend time for the new account creation;
- no necessity to remember login and password to the store account – Facebook authentication is as easy as possible and secure;
- registration and authorization are done in two clicks.
Features
- opportunity to create the new store account based on Facebook authentication;
- user can edit profile anytime (add the email there and rest of details);
- it’s possible to connect Instagram authentication to any existing store account;
- user can unlink his Facebook from the store account.
Setup Facebook App by PrestaShop store admin
- Navigate to https://developers.facebook.com, login to your Facebook account if you are not already logged in. Click My Apps in the top-right corner.
- Add a new app Create App
- Select Consumer and click Next
- Specify App Display Name for your app and App Contact Email. Select a Business Manager Account if you have one. Click Create App ID
- Click Set Up in the Facebook Login block
- Click WWW button:
- Insert Site URL of your site, then press Save and Continue:
- Activate “Login with the JavaScript SDK” (switch to Yes) in the Facebook Login settings and insert your site domain in the “Allowed Domains for the JavaScript SDK” field. Click on the Save button
- Specify Privacy Policy URL of your website. Save the same URL in the text box right below the Data Deletion Callback URL of the User Data Deletion section. Select the Category that your website belongs to
- Click on slider button in the App Mode option and make app Live:
Module settings
- Copy the App ID and App Secret and paste them into the corresponding fields on the module configuration page:
Installation:
- Upload the module through the Backoffice (Modules > Add New Module) or using FTP-client
- Hit Install it and enter the configuration
Setting the CSS styles for the button:
- The style file is here:
/modules/facebookauth/views/css/fbauthfront.css
Module workflow cases:
1. When the user is not logged in and clicks on the “Log in with Facebook” button for the first time on the Login page or on the Registration page:
– after clicking on the “Log in with Facebook” button, a Facebook page opens where the user needs to confirm his consent to sending his data. After confirmation, he will be redirected to the user account on your website.
– a new customer account is created, the e-mail name and surname are taken from his Facebook account, and the password is generated automatically (the user can change this data in his account):
2. When the user is not logged in but already has an account on your store and clicks on the “Log in with Facebook” button on the Login page or on the Registration page:
– after clicking the “Log in with Facebook” button, the user automatically logs in, he will be redirected to his user account on your website.
3. When deleting a customer account:
– if a customer’s account is deleted from Prestoshop store, all links to the customer’s Facebook account will be deleted from the database as well.
4. When changing the module settings on the configuration page in the admin panel:
– all user accesses are preserved, when changing “Facebook App ID” and “Facebook App Secret” to other values.
– if the “Facebook App ID” or “Facebook App Secret” is entered incorrectly or the Facebook application is not configured correctly, then an error will be shown to the user when trying to authenticate via Facebook:
