Child pages
  • Social Login - Magento 2

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Section
Column
width50%
Panel

1. Create an account at Facebook

Expand
titleClick to view details

If you are new to Facebook you will first need to create an account.

Make sure to fill in all the fields and follow the registration steps provided by Facebook.

Panel

2. Register Facebook application

Expand
titleClick to view details

At the Facebook for Developers page click button.

  • Select Website platform for your App:

  • Name the application at the Quick Start for Website screen and click button;
  • Choose the category for the application and click button;
  • Scroll down to the Tell us about your website block, paste your store homepage URL and click button;
  • Scroll down once again to the Next Steps section and click Login block:

The application is now created.

Panel

3. Get API Key and Secret

Expand
titleClick to view details

In the upper right-hand corner of the screen click My Apps and select the newly created application:

You are now at the application dashboard:

  • Find and copy App ID and App Secret;
  • Navigate to your store backend Stores > Configuration > aheadWorks extensions > Social Login;
  • Paste the App ID into the Consumer Key field and App Secret into the Consumer Secret field of the Facebook configuration section.
Panel

4. Activate app

Expand
titleClick to view details

Proceed to the application basic settings:

Fill in the App Domains field and Contact Email field. These are the must to activate the application.

Navigate to App Review section and click the switch.

 

That's it. Once enabled the Facebook button will appear at the set Social Login blocks of your store.

Column
width50%

 

Registering Google

...

App

Section
Column
width50%
Panel

1. Create an account at Google

Expand
titleClick to view details

If you are new to Google you will first need to create an account.

Make sure to fill in all the fields and follow the registration steps provided by Google.

Panel

2. Register Google application

Expand
titleClick to view details

At the Google Developers Console create new project by clicking Select a project in the upper right-hand corner of the screen:

  • Type in the name of the project and click button;
  • Click Use google APIs block:

  • Navigate to Credentials > OAuth consent screen:

  • Fill in the Product name shown to users field;
  • In the field Homepage URL paste the homepage URL of your store (without index.php);
  • Click button;
  • In the APIs Credentials window click button and select OAuth client ID:

  • At the Credentials page select Web application as an Application Type;
  • Type in the name of the application in the Name field;
  • In the field Authorized redirect URLs field paste the homepage URL of your store and /social/account/callback/provider/google/ path right after (refer to the screenshot below for example):

  • Click button.

You will be displayed with an OAuth client pop up. Do not close the pop up yet.

Panel

3. Get API Key and Secret

Expand
titleClik to view details

Copy the Client ID and Cliend Secret from the OAuth client pop up:

  • Navigate to your store backend Stores > Configuration > aheadWorks extensions > Social Login;
  • Paste the Client ID into the Consumer Key field and Client Secret into the Consumer Secret field of the Google configuration section.

That's it. Once enabled the Google + button will appear at the set Social Login blocks of your store.

Column
width50%

 

...