Social Login

Social Login for Magento 2

User Guide

Version 1.0

0 Social Login

Table of Contents

I) Introduction………………………………………………………………………………….. 2

II) Confguration……………………………………………………………………………….. 3 1. Where to fnd Extension…………………………………………………………………..3 2. General Settings………………………………………………………………………….. 4 3. Social Media Settings…………………………………………………………………... 12 ………………………………………………………………………………….. 14 ………………………………………………………………………………..21 LinkedIn………………………………………………………………………………….24 Amazon………………………………………………………………………………….27

III) Support……………………………………………………………………………………..29

1 Social Login

I) Introduction

Magento 2 Social Login is an extension that allows users to register and log in to your website within a few clicks through social networks, instead of flling register and login form many times. With this extension, store owners can get an increase of the number of registrations, improve user experience, and collect customers’ social profle information.

● Enable login and register with the most popular social media like Facebook, Google, Amazon, LinkedIn ● Display ajax popup for register and login ● Customize social login button positions ● Support 3 social login button shapes ● Redirect to custom URL after login/register

2 Social Login

II) Confguration

1. Where to fnd Extension

After installing the extension, navigate to Stores > Settings > Confguration

3 Social Login

In the left panel, span MAGEZON EXTENSIONS and click Social Login. In the right section, you will see 5 tabs, including General Settings, Google, Facebook, LinkedIn, and Amazon.

2. General Settings

In the General Settings tab, to turn on the extension, turn Enable Social Login to Yes. Go to the next block, there is Social Buttons Sorting that lists 4 social media buttons for you to make them displayed (Google, Facebook, Amazon, LinkedIn). You can drag & drop these icons to arrange social media buttons displayed in the frontend.

4 Social Login

After that, in Add Social Login to block, choose the place where you want to show Social Login buttons.

● Login Popup: This option allows social media buttons to be shown on login and register ajax popup.

5 Social Login

● Above/ Below customer login form: This option allows social media buttons to be shown above/ below on the login page.

6 Social Login

● Above/ Below customer register form: This option allows social media buttons to be shown above/ below on the registration page.

7 Social Login

● Shopping cart page: This option allows social media buttons to be shown on the shopping cart page.

8 Social Login

Then, pick the button style you want in Login Buttons Shape block. ● Round buttons

● Rectangular buttons

9 Social Login

● Square buttons

Switch Enable Ajax Popup to Yes to activate Ajax popup that allows users to login or registration through that popup. If not, choose No. You also can choose Social Button Position with 4 options: Top, Bottom, Right, Left to place social media buttons on ajax popup.

10 Social Login

11 Social Login

12 Social Login

Finally, you can select Redirect after Login with options Stay on the current page, Refresh the current page, To custom URL. ● Stay on the current page: Choose this option to stay on the current page. ● Refresh the current page: Choose this option to refresh the current page.

13 Social Login

● To custom URL: Choose this option if you want to redirect to the specifc page. When you select this option, the Redirect URL after Login will appear. Fill in the URL of the specifc page you want to direct.

14 Social Login

3. Social Media Settings

There are 4 social media that admin can enable in this extension: Google, Facebook, LinkedIn, and Amazon. Turn Enabled to Yes to display these social media buttons on your site.

15 Social Login

16 Social Login

● Google

Select Click here Click on New Project

Fill in the Project name, Organization, and Location. Then, Create.

The notifcation will appear.

17 Social Login

To proceed with creating new credentials for Social Login extension for Magento 2, please go to APIs and Services > Credentials as shown on the screenshot below.

18 Social Login

Next, press the + CREATE CREDENTIALS button. Then, a drop down appears, where you need to select the OAuth Client ID option.

To start the OAuth Consent Screen confguration, please press the CONFIGURE CONSENT SCREEN.

19 Social Login

Select the External option as shown on the example screenshot below. Then, click

CREATE.

20 Social Login

Once again go to APIs and Services > Credentials, and then select the + CREATE CREDENTIALS > OAuth Client ID. This time, you will be taken to the OAuth Client ID Creation. To proceed, please select the Web Application type.

21 Social Login

After you set the confg as Web Application, additional felds will appear. Fill them in as required by Google, then click CREATE.

22 Social Login

After a successful OAuth Credentials creation, a pop-up window with a Client ID and Client Secret will appear. Please copy the Client ID and Client Secret, then insert these in the appropriate blocks in the backend.

23 Social Login

● Facebook

Register as a developer and choose My Apps on the right above. After that, fll in the information. Choose Facebook Login and Create App.

24 Social Login

Complete the Display Name and Contact Email for your app. After that, click the Create App ID.

Then, go to the Settings > Basic tab to confgure your app.

25 Social Login

Fill in the App Domains, and choose your app Category. Copy the Valid Redirect URL in the backend and paste to User Data Deletion. Finally, Save Changes.

To apply the confguration, change the Status from In development to Live.

Insert your API Key and API Secret in the backend settings and Save the confguration.

26 Social Login

● LinkedIn

Go to the Create App.

27 Social Login

Fill in your Company and Application Name, Description, Website URL, your Business Email and Phone. Application logo is an important part of information.

Tick on I have read and agree to these terms. Click on the Create App.

28 Social Login

Go to the My Apps tab to View all apps. Select Auth to fnd out the information you need. Copy the Client ID and the Client Secret and paste it in the backend of the extension. Save the confguration.

29 Social Login

● Amazon

Register an account. Choose to Create your Amazon Developer account.

After completing the registration, go to Settings > Security Profle

Fill in the Security Profle Name and Security Profle Description. Then, Save.

30 Social Login

Go to Web Settings to fnd out Client ID and Client Secret. Copy and paste these into the backend of the extension.

31 Social Login

III) Support

If you have any questions or need any support, feel free to contact us via the following ways. We will get back to you within 24 hours after you submit your support request.

● Submit contact form. ● Email us at [email protected]. ● Submit a ticket. ● Contact us through Skype: [email protected]. ● Contact us via live chat on our website.

32