[vendor social login addon]

30
© CedCommerce. All rights reserved. [email protected] [Vendor Social Login Addon] Vendor Social Login addon is a very useful addon for the Magento ecommerce platform as well as for CedCommerce Multi-Vendor Marketplace. It provides your store the feature to login/register without filling all the details about yourself. It provides four very popular social networking sites login feature.

Upload: others

Post on 05-Jan-2022

15 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: [Vendor Social Login Addon]

© CedCommerce. All rights reserved.

[email protected]

[Vendor Social Login Addon] Vendor Social Login addon is a very useful addon for the Magento ecommerce platform as well as for CedCommerce Multi-Vendor Marketplace. It provides your store the feature to login/register without filling all the details about yourself. It provides four very popular social networking sites login feature.

Page 2: [Vendor Social Login Addon]

2

© CedCommerce. All Rights Reserved.

Vendor Social Login

Admin User Manual

Version - 1.0

Page 3: [Vendor Social Login Addon]

3

© CedCommerce. All Rights Reserved.

Contents I. Overview ............................................................................................................................................... 4

II. Configure SocialLogin ............................................................................................................................ 4

i. Google Options ................................................................................................................................. 6

ii. Facebook Options ........................................................................................................................... 10

iii. Twitter Options ............................................................................................................................... 15

iv. LinkedIn Options ............................................................................................................................. 18

III. Frontend Login / Register Panel ...................................................................................................... 21

IV. Customer Account Pages ................................................................................................................ 22

I. Google SocialLogin .......................................................................................................................... 22

II. Facebook SocialLogin ...................................................................................................................... 24

III. Twitter SocialLogin ...................................................................................................................... 25

IV. LinkedIn SocialLogin .................................................................................................................... 26

V. Vendor Social Login/SignUp ................................................................................................................ 27

I. Vendor Social Login ......................................................................................................................... 27

II. Vendor Social Signup ....................................................................................................................... 28

VI. Support............................................................................................................................................ 30

Page 4: [Vendor Social Login Addon]

4

© CedCommerce. All Rights Reserved.

Overview CedCommerce Vendor Social Login addon is basically a CedCommerce Multi-Vendor

Marketplace addon for Magento to login on ecommerce site without filling all the details like

email address and other required fields. It provides you one click login features to the store.

Currently it provides four types of social networking sites login features: Facebook, Google,

Twitter and LinkedIn.

Admin can follow this user manual guide to configure the login on the Magento store. The entire

social login can be separately disabled by the admin. It saves time of the customers to fill the

entries of the login detail and login or register to the system.

Configure Vendor Social Login The website admin can manage the Vendor Social Login addon configuration by going to the

System > Configuration menu in the admin panel.

Page 5: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

5

Figure 1- Vendor Social Login Configuration

When you click on the above configuration link you will see the following fields. It will show

total four social login configuration fieldsets. When you enable the particular social login

configuration then only the setting field will come and you will be able to see the API credential

filling area.

Page 6: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

6

Figure 2- Configuration Settings

Vendor Social Login settings information:-

i. Google Options Google is one of the very well-known sites over the web. Generally most of the users have a

Google account so they can login very easily on the Magento store just by clicking Google

click button once.

To get the API credentials, Google admin needs to create a Google Project for Google

developer console. Admin can reach the developer console by the following link

https://console.developers.google.com/

Click on the above link. If you do not have an account then you can sign-up. If you have an

account then can login and proceed to the creation of the Google Project.

Page 7: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

7

Click on the “Create Project” link, it will show a popup to create a new project with the

project name and all the details.

Figure 3 - Step 1- Create Project

A popup will appear asking for the project name. Just fill the name and click the Create

button. It will take a few seconds and it will show you the next screen.

Figure 4- Step 2- Name Project

On the next screen you need to expand the left section “API &auth” under this you will

see the “Credentials” link and “Create a New Client Id”.

Page 8: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

8

Figure 5- Step 3- Create new Client Id

Now you need to select the project type information, you need to select the “Web

Application” type. You need to enter the name of the project and select the email id for

the next step. After then the following screen will be shown to you. You need to enter the

Domain i.e. the base URL of the site. Here it is filled as https://www.example.com and the

callback URL. You need to enter here that is of the following type:

https://www.example.com/index.php/cedsociallogin/google/connect/. This means the

example.com is your domain for Magento installation, after that you need to append the

URL “index.php/cedsociallogin/google/connect/” and fill in the Google Project section. After

that, click on the “Create Client Id” button.

Page 9: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

9

Figure 6- Step 4- Set Call back url

After filling all these entries your configuration is ready. As per the following screen you

will get the credentials you need: “Client Id” and “Secret Key” and paste it in the

configuration section. Now your Magento store is ready with the login with Google link.

Page 10: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

10

Figure 7- Step 5- Copy Api Credentials

Copy the credentials of the client and the secret key, paste it in the Magento

configuration panel.

Figure 8- Step 6- Paste Api Credentials

ii. Facebook Options Facebook is also one of the most popular social networking sites. It is having more than 1

billion active users. So, if any customer wants to place the order with the login of the

Facebook Connect, he can do easily by clicking on the facebook button just once.

To enable this feature admin needs to do the following settings to get the App Id and Secret

Key. Admin needs to create a new facebook application to make it working. He can create a

new application by the following link https://developers.facebook.com/. Just visit this link

and click on the “Add new App” link under “My App” menu.

Page 11: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

11

Figure 9- Step1 - Create Facebook App

A popup will open up to ask for the app type, select he web app and click continue.

Figure 10- Step 2- Select Website type

Page 12: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

12

On the next popup you will see that it will ask for the name of the app. Enter the name

and click continue.

Figure 11- Step 3- Create new Facebook App Id

The popup shown below will appear, select the application type and then category. Click

on the “Create App Id”.

Figure 12 - Step 4- Create App Id

Page 13: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

13

On the main settings configuration page of the app please go to the settings tab and

enter the following details.

Figure 13- Step 5 - Set web url and email

You can enter the site URL, your content, email id and click on the Save Changes button.

Page 14: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

14

Figure 14- Step 6 - Set support email

On the app details tab enter the support email address.

Figure 15- Step 7- turn live app

Page 15: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

15

Now to make the app live go to the “Status and Review” tab and click on the “Yes Make

it Live” button.

Figure 16- Step 8- Copy Api credential

Go to the “Dashboard” link, copy the app id and secret key.

Paste the information in the Magento admin panel’s “Social Login Facebook Options” fieldset.

Figure 17- Step 9- Paste api credential

Now it will show the facebook login button on frontend.

iii. Twitter Options To enable the login functionality with Twitter, the admin needs to create a twitter app. He

can create a new app by the following link https://apps.twitter.com/ and click on the

button “Create New App”. It will show a full form to enter the information regarding the

app.

Page 16: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

16

Figure 18- Step 1- Create app

When you click on the “Create new App” button you will be able to see the following

form, enter all the required fields in it.

Page 17: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

17

Figure 19- Step 2- Fill infomration

Page 18: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

18

In the above information, the callback URL field is important. You need to stress on this

link http://example.com/index.php/cedsociallogin/twitter/connect/. The call back URL

should be append “cedsociallogin/twitter/connect/” to the Magento base

URL. Accept the agreement and click on the “Create your Twitter application” button.

Now go to the “Key and Access Token” and copy the API credentials.

Figure 20- Step 3- Copy API credential

Copy the API Key & Secret Key and paste them in the Magento Social Login configuration.

iv. LinkedIn Options LinkedIn is also quite a popular social networking site for professionals. Admin can easily

show the login option with the LinkedIn on the site. He needs to create an application for

LinkedIn. This can be created by the following URL

https://www.linkedin.com/developer/apps. Click on the “Create Application” button.

Page 19: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

19

Figure 21- Step 1- Create App

Click on the “Create New App” button, it will show an application form. Fill the fields, agree to

the terms & condition and then click Submit button.

Page 20: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

20

The next step will ask you for the access permission. You can select the “r_basicprofile”,

“r_emailaddress” permission for accessing the account related information. After that you

need to register “Authorized Redirect URL”. It will be something like

http://example.com/index.php/cedsociallogin/linkedin/connect/. Your Magento base URL will

be appended by the “cedsociallogin/linkedin/connect/” URL key.

Figure 22- Step 2- Set permission

Now copy the details of the API key and Secret Key, paste it in the Magento configuration panel

for LinkedIn.

Page 21: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

21

Figure 23- Step 3- Paste API credential

After doing all the configuration setting you can see that on frontend the login buttons will be

visible properly and any customer can login in the Magento store by clicking the social login

button.

Frontend Login/Register Panel Customer can see the Social Login icons for login on the Magneto customer login page and the

customer register page. If the customer is not registered with the social login registered email id

then it will create a new account on the Magento store with social login email id.

Figure 24- Frontend Login Panel

Login page is shown in the above image. You will get all the social login icons to login to the

Magneto store. In the same way, customer account register page also shows the social login

buttons.

Page 22: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

22

Figure 25- Registration Panel

Customer can register/login from the login page or the account registration page.

Customer Account Pages Here customer gets the features to connect the magento account store with the social login

accounts.

I. Google Social Login

In the customer account section, the customer will get the link for “Google Social Login” to see

his Google account and he can disconnect the account details of Google Social Login at any time.

Page 23: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

23

Figure 26- Google Account page

Google account shown above is not connected with Magento. The customer can connect

his Google account anytime with the Magento store.

Page 24: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

24

Figure 27- Google Connected page

When your account is properly connected with Google then it will show the above page. If

any profile picture is available then it will be shown, otherwise email id and Google

account id will be shown on the page.

II. Facebook Social Login The way the Google account is connected with the Magneto store, in the same way we can

connect Facebook account and after the connection a “Disconnect” button will be shown

at the top right corner of the screen. The customer can disconnect the Facebook login from

the Magneto store any time.

Page 25: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

25

Figure 28- Facebook Account page

The Facebook Connect page is shown above. The customer can click on the disconnect

button any time and remove the account from the Magento store.

III. Twitter Social Login Twitter social login account page is the same as Google and Facebook account pages. The

twitter account does not register with its original email id because twitter does not return

correct email id of the customer to create account. So, the customer needs to manually

change the email id with his correct email id.

Page 26: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

26

Figure 29- Twitter Acount page

IV. LinkedIn Social Login LinkedIn also works in the same way as Google, Facebook and Twitter do. The account can

be created any time by going to the link “LinkedIn Social Login” and can disconnect the

account from the Magento store any time.

Page 27: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

27

Figure 30- LinkedinAcount page

Vendor Social Login/SignUp Vendor Social Login Addon for CedCommerce Multi-Vendor Marketplace provides the features

to the vendor to Login or Sign-up by his Social Networking site account like Facebook, Google,

LinkedIn and Twitter.

I. Vendor Social Login Vendor Social Login Addon will add social login buttons on the Vendor Login page using which the vendor can login by his social account.

Page 28: [Vendor Social Login Addon]

© CedCommerce. All Rights Reserved.

28

II. Vendor Social Signup Vendor Social Login Addon also provides the functionality to the vendor to register by

using his Social Networking Account. The social signup buttons for the vendor will be

displayed on the Vendor Signup page using which the vendor can sign-up into the website.

Page 29: [Vendor Social Login Addon]

29

© CedCommerce. All Rights Reserved.

Page 30: [Vendor Social Login Addon]

30

V. Support If you need any support or have questions directly related to Vendor Social Login Addon,

please use our Online Message Form to contact our support team or send us an email at

[email protected]

Best Regards,

CedCommerce Team

© CedCommerce. All Rights Reserved.