You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 16 Next »

Thank you for purchasing our extension. If you have any questions that are beyond the scope of this document, do not hesitate to leave us an email via [email protected]

Created: 11/05/2016 | By: Magenest | Support Portal: http://servicedesk.izysync.com/servicedesk/customer/portal/30 

 


 

Introduction

Magento 2 Social Login is an extension developed by Magenest to help customers login to Magento 2 stores conveniently with their social accounts. 

Extension's page: Social Login and Share

Features For Admins 

  • Set up app for each social network including: Twitter, Facebook, Google, Amazon, LinkedIn, Pinterest, Instagram, Reddit, Line
  • Add login popup with social login options
  • Add social login options to sign in, sign up page
  • Set social login suggestion for customer at checkout page for customers who used to login with social account on the store
  • Add comment section using Facebook account for customer on product detail page
  • Add social sharing buttons on product page

Features For Customers

  • Choose to login with one of 9 social accounts: Twitter, Facebook, Google, Amazon, Linkedin, Pinterest, Instagram, Reddit, Line
  • Share products on their social networks
  • Use Facebook account to comment on the Magento 2 store
  • Be suggested with social login at checkout page if they used to login with social account on the store  

System Requirements

 Your store should be running on Magento 2 Community Edition version 2.0.0, 2.1.x, 2.2.x.

 

Configuration

General Configuration 

First, navigate to Stores > Configuration > Magenest > Social Login, you will be able to enable:

  • The login popup when customer clicks on Sign In button on top menu bar
  • The social login options in Sign Up/Create an account page
  • The social login on checkout page, including the sign in button on the top of the page, and the social login suggestion for customers who used to login with social accounts on the store
  • The ability to comment on product page using Facebook account
  • The ability to share the product link via social networks that are chosen in the social sharing options: Twitter, Facebook, Google+, LinkedIn, Pinterest, Reddit

 

Credentials Settings

In order to connect the social app to your Magento 2 store, you have to set up the app as follows:

 

Google+

How to set Client ID and Client Secret of Google+

 Go to the Google Developers Console – https://console.developers.google.com/

Select an existing project, or create a new project by clicking Create Project:

 

  • In the Project name field, type in a name for your new project.

  • In the Project ID field, the console has created project ID.

  • Click on the Create button and the project to be created within some seconds.

 

In the left sidebar, select APIs under the APIs & auth section.

Find the Google+ API service and set its status to Enable.

Click Create Credentials select OAuth Client ID

  • Create Client ID dialog box would be appearing for choosing application type.

  • In the Application type section of the dialog, select Web application and click on the Configure consent screen button.

  • Choose Email address, enter Product name and save the form.

  • In the Authorized JavaScript origins field, enter your app origin. If you want to allow your app to run on different protocols, domains, or subdomains, then you can enter multiple origins.

  • In the Authorized redirect URI field, enter the redirect URL.

  • Click on Create.


 

Now you can see the Client ID for web application section. Select Client ID  and Client Secret then fill in Configuration of Google in Backend of Magento 2 store.

 

In the backend of Magento 2, in the Google+ setting

  • Enable: To enable Google login and sharing option 
  • Client ID: Google+ application ID  
  • Client Secret: Google+ application secret 
  • Redirect URI: You will use this URL in Google to connect the app

 

 

 

 


Facebook 

How to set Client ID and Client Secret of Facebook

Go to the https://developers.facebook.com/apps/ and login at your Facebook developer account.

Click Add a New App button on the top right to create a new app ID. A popup will display as below


In the Facebook for developers Settings, choose Basic, click on the Add Platform button, then enter your site URL.

 

 

Click on Save changes button. You will see that there are App ID and App secret, note that you will need these to configure the module in the backend of Magento 2.

Choose Facebook Login > Settings link from the left menu section at the apps page, fill in Valid OAuth Redirect URIs with the Redirect URI obtained from Magento 2 configuration.

Then you have to make your app public to everyone. On the top bar, click on Status, a pop up as below will be displayed. Confirm to make the app public.



 

In Magento 2 backend, Facebook settings:
  • Enable: choose Yes to enable Facebook social login and share
  • Client ID: Fill in the Facebook app ID obtained from above
  • Client Secret: Fill in the Facebook app secret from above

 


Twitter 

How to set Client ID and Client Secret of Twitter

Go to the Application Management page and login with your Twitter developer account. 

Follow this tutorial article to create a Twitter app http://docs.inboundnow.com/guide/create-twitter-application/ 

 

 

 

twitter-app-creation-tutorial-by-codexworld-screencapture-2

 
In Magento 2 backend, Twitter settings:
  • Enable: Choose Yes to enable the Twitter social login and share
  • Client ID: Twitter application ID 
  • Client Secret: Twitter application secret 

 



Pinterest

How to set Client ID and Client Secret of Pinterest

Go to https://developers.pinterest.com/ and login your Pinterest developer account.

Choose AppCreate app button to create a new application.



New tab is open with App ID and App secret, you must add the site URL and Redirect Uri (obtained from the Google+ settings in Magento backend) for web in the Platforms section.

Use the app ID and app secret to configure the module in the Magento 2 backend. 


In Magento 2 backend, 

  • Enable: To enable Pinterest login and share 
  • Client ID: Fill in the Pinterest app ID from above
  • Client Secret: Fill in the Pinterest app secret from above
  • Redirect URI: Use this in Pinterest to create application

 



Instagram 
How to set Client ID and Client Secret of Instagram
Go to https://www.instagram.com/developer/ and login at your Instagram developer account.
Choose Manage Clients > Register new Client ID,
In this registration form, fill in the Redirect Uri (you can get this in Magento 2 configuration) in Valid redirect URIs, and remember to unselect the Disable implicit OAuth in Security tab.

 


After clicking on Register button, Manage Clients tab is open, you will use the Client ID and Client Secret (in Manage) to configure the module in Magento backend.

In Magento 2 backend, go to Instagram configuration.

  • Enable: To enable the Instagram login and share 
  • Client ID: Instagram application ID 
  • Client Secret: Instagram application secret 
  • Redirect URI: Use this in Instagram to create application.

 


LinkedIn
 

How to set Client ID and Client Secret of LinkedIn   

Go to https://developer.linkedin.com/ and login with your LinkedIn developer account.

Choose My Apps > Create Application


 

 

 

After filling in necessary information and submit the form, an Authentication tab will be displayed. In the Default Application Permissions, add the Redirect URI obtained from Magento 2 configuration. Then click on Update.


 

 
In Magento 2 backend, go to LinkedIn configuration
  • Enable: To enable LinkedIn login and share option
  • Client ID: Linkedin application ID 
  • Client Secret: Linkedin application secret 
  • Redirect URI: Use this in LinkedIn to create application.

 


 


Front end

Social login options

  • Show the Social Login options on Sign Up page


 

  • Show popup with social login options when clicking on Sign In

 

  • Twitter login


  • Facebook login

 

  • Google login


  • Amazon login


  • LinkedIn login 


  • Instagram login


  • Pinterest login


  • Reddit login



  • Line login


Sharing on social networks

Customers can share the product link via their social network with the sharing options available for Twitter, Facebook, Google+, LinkedIn, Pinterest and Reddit.

 

Comment on product using Facebook account

Under the product descriptions, customers can leave a comment using their Facebook account.

 

Social login suggestion on checkout page

If customers used to login with social accounts on the store, on checkout page, when they fill in the email address (which is corresponding with their social account email), the suggestion to login with that social account will be displayed.


 


Update

  • When a new update is available, we will provide you with a new package containing our updated extension.
  • You will have to delete the module directory and repeat the installing steps above.
  • Flush the config cache. Your store and newly installed module should be working as expected.

 


Support


  • We will reply to support requests within 2 business days.
  • We will offer lifetime free update and 6 months free support for all of our paid products. Support includes answering questions related to our products, bug/error fixing to make sure our products fit well in your site exactly like our demo.
  • Support DOES NOT include other series such as customizing our products, installation and uninstallation service.

 


 

Once again, thank you for purchasing our extension. If you have any questions relating to this extension, please do not hesitate to contact us for support.

Magenest

  • No labels