Social Login 2.3 Setup

Overview

This document provides instructions on how to set up the Social login extension so users can sign-up/login to your site via Social Accounts:

App creation and setup #

For social login to work correctly you need to create an app on each social network so that your site can be linked to the app. We have created separate docs for each app setup:

Link apps to your site

Once you have created each app you will need to copy over the App ID/Key and the secret key and paste them into the social network tabs on the settings page.

General settings #

The general settings tab for the social login extension allows you to:

  • Turn on/off the social tab on the account page
  • Show the social login buttons by default on the default register form
  • Show the social login buttons by default on the default login form

Social Networks settings

Each social network has a setting that can activate/deactivate that particular network. Once the setting is turned on you'll see fields where you must add API Keys for the social login to work.

Shortcodes #

The social login extension allows you to place social login buttons anywhere on your site using shortcodes. You can create multiple social login shortcodes so you can have a different output on your site depending on where you want to add the buttons.

The general settings for each shortcode allow you to:

  • Assign specific role to a user on registration via Social Login
  • Show Social Buttons to logged-in users only
  • Keep users logged in
  • Choose integration type for the Social buttons: Login only, Register only, or Both ( default ).

Creating a new social login shortcode

To create a social login shortcode click on social login in the Ultimate Member menu and click the Add new button. On the new social login page, you can decide which buttons to show and also apply some styling options which will alter how the buttons appear on your site. To output, the buttons on your site all you need to do is copy the shortcode and add it to your site.

wp-admin > Ultimate Member > Social Login

wp-admin > Appearance > Widgets

Social registration forms #

When a user tries to register on your site using the social login buttons they will be taken to the social network site to accept the app permissions and if they accept they will be redirected back to your site where they will see an overlay that shows the social registration form (this form is automatically added to the forms list when you activate the plugin).

This form is required to collect the required user details (for example Twitter does not pass over a user’s email address) so the user can complete the 2-step registration process or automatically generate an email address in the One-step process. Once a social network account is connected to a user on your site the user will be logged in straight away when they come back to your site (as long as they are logged in to the social network on that browser).

You can create and edit the social registration form on wp-admin > Ultimate Member > Forms

There are two ways to process data from Social Network Apps to register a user on your site: one-step process or two-step process.

One-Step Process ( since version 2.3 )

If you want to register a user automatically without showing the Register form fields on the overlay, you can choose this process. This allows users to register and then log in automatically on successful registration. 

When one of the Social Networks does not pass a user's email address or Email Address has already been used in the site, there are 4 options to choose from which you can use to continue the Registration process:

- Link Accounts & Login immediately

- Link Accounts & Redirect to Login Page

- Allow new account creation with a generated Email Address

- Do not link accounts & prevent account creation

There's also an option where you can show a Splash Screen to display pre-loading content or Image loader on the overlay during the registration process. You can modify the content in the Social Register form using the UM Form Builder.

Two-Step Process ( since version 1.0 )

There are instances where you want to allow users to check the fields that will be submitted to your site on the registration process - Two-Step process enables users to check the details and allows them to edit in the form or add extra fields to fill out before submitting the Register form. 





Profile data import #

Sync Register form Fields from Social Network fields ( since version 2.3 )

Social Login adds a field option in the form builder which synchronizes the specific data coming from the Social Networks to populate the field value on the Registration process. Please take note that not all Social Networks return the same data e.g. Instagram doesn't pass an Email Address but Facebook returns it but with Email Permissions in the Facebook application.


Please see the List of Sync Field options and Sync Field with extended options.

Profile photo import

The social login extension will import a user’s profile photo from their social network profile as the profile photo on your site. The most recently connected social network will be the photo that is used (e.g if a user registers with Twitter it will show their Twitter profile photo but if on the account page they connect to Facebook then their Facebook profile photo will become the profile photo on your site).

Account page #

The social login extension adds a new tab to the user account page called “social connect”. On this tab, a user can connect/disconnect their social networks from their account.