Reading list Switch to dark mode

    Prestashop Social Login {User-Guide}

    Updated 19 October 2023

    Simplify the login and registration process of your store with Prestashop Social Login. Let customers create accounts quickly through Facebook, Google, Twitter (X), and Amazon.

    • Facebook, Google, Twitter (X), and Amazon login buttons on the login page.
    • Easy and Fast login.
    • Customers do not need to remember their username and password.
    • Enhance customer experience.

    Note: PrestaShop Social Login module is compatible with Prestashop version 8.x.x.

    Features

    • One-click registration process.
    • Easy to integrate user accounts to the store.
    • Admin has to provide their credentials for Facebook, Google, Twitter (X), and Amazon.
    • Admin has to create Facebook, Google, Twitter (X), and Amazon apps.

    Installation

    1. Go to back office ->modules.
    2. Upload the module zip file.
    3. The module will automatically get installed on your Prestashop.
    Social Login Installation
    Social Login Installation
    Social Login Installation

    Note

    For displaying the social login button on the front end in Prestashop Version 1.6 you have to add code on following tpl files:

    On yourprestashopfolder/themes/your-theme/authentication.tpl file:

    Add

    Searching for an experienced
    Prestashop Company ?
    Find out More
    {hook h="displayWkSocialLoginBtn"}

    inside “p” tag having class “submit”.

    Configuring the Module

    After successful installation, the admin has to configure the module.

    image-152

    How to get API Keys

    To enable the Facebook, Google, Amazon, and Twitter (X) login tab, the admin needs to provide the Facebook app ID, Google app client Id, Amazon App client ID, and Twitter App consumer ID.

    How to get Facebook App Id

    Admin has to create developer account on Facebook. Admin can create a developer account at https://developers.facebook.com/

    Now admin has to add a new app to his account.

    1-10
    4
    5
    6

    But, admin needs to make the app live for public then only Facebook login tab will be displayed at the frontend.

    Go to settings and provide the email.

    2-6

    Admin will go to status and review to make the app live for public.

    8

    How to get Google App Client Id

    To get the google app id, admin has to create an account on google developers console.

    Now create a new project. Go to select a project->create a project.

    9

    Now, go to google API keys-> credentials-> OAuth Consent screen. Here admin has to provide email id and product name.

    Again go to credentials and select OAuth client id as new credentials.

    10

    Select web application and click on create to have OAuth client id.

    3-7

    How to get Twitter (X) App counsumer ID

    Admin has to create a developer account on Twitter. Admin can create a developer account at https://developer.twitter.com/

    After signing up as a developer from Twitter the admin needs to provide the information to create the project.

    image-153

    After successfully submitting the information, a project will be created on the admin’s Twitter (X) developer account.

    image-155

    Once you click to configure the project app button, the admin will redirect to the below-mentioned page to set up the app.

    image-156

    After clicking on the setup button the admin needs to enter the required details to set up the app.

    image-178

    Just after saving these details, a new tab/section will add to the Twitter developer account.

    image-158

    By clicking on the regenerate button, new credentials will be generated.

    image-160

    How to get Amazon App client ID

    Admin has to create a developer account on Amazon. Admin can create a developer account at https://developer.amazon.com/dashboard

    Once the admin creates the account on the Amazon developer account he will redirect to the below-mentioned page.

    image-163

    After clicking on the settings button, the admin will redirect to the below mentioned page.

    image-164

    Once the admin clicks on the Security Profile button, the admin needs to create a new security profile.

    image-165
    image-166

    After creating a new Security Profile, it will be displayed in the security profile section and the admin needs to edit it.

    image-167
    image-186

    Front End

    Now, admin can have facebook and google login tab at front end for login.

    image-161

    Support

    For any kind of technical assistance or query, please raise a ticket at http://webkul.uvdesk.com or send us a mail at [email protected]

    Also, please explore our Prestashop development services and vast range of quality Prestashop addons.

    Current Product Version - 4.1.0

    Supported Framework Version - 8.x.x, 1.7.x.x

    Blog Version - 8.x.x, 1.7.x.x
    • Version 8.x.x, 1.7.x.x
    • Version 1.7.x.x
    • Version 1.6.x.x
    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content