Step 1: Install and Configure WordPress Social Login
You’ll need to create “applications” in the social networks you wish to offer integration for. See below for help for a few top networks:
You will need an “App ID” and “App Secret” key.
- Go to: https://developers.facebook.com/apps
- Hover over the “My Apps” tab and select “Add a New App”.
- Select Website (www) as the platform.
- Click “Skip and Create App App ID” in the upper right. This will bring up a box to simply enter:
- Display Name (I just use my website name)
- Don’t enter a namespace
- Select “No” for “Is this a test version of another app?”
- Choose an appropriate category
- Create App ID
- You’ve got an app! Click “Settings” in the left column and update your “App Domain” and “Site URL”. You can now copy and paste the “App ID” and “App Secret” keys into the Facebook section under Settings > WP Social Login in your WordPress site admin.
You will need an “Application Key” and “Application Secret”.
- Go to https://apps.twitter.com/
- Click “Create New App”.
- Under “Application Details” complete the fields for Name, Description and Website. (Note: Make sure that your Twitter account has a verified mobile number before completing this step. You can add your mobile number via Settings > Mobile here.)
- For the “Callback URL”, you need to enter the URL as provided in the Settings > WP Social Login > Twitter admin screen. The URL will look something like this: http://www.YOURDOMAIN.com/wp-content/plugins/wordpress-social-login/hybridauth/?hauth.done=Twitter
- Thats (technically) it. For completeness, I did go back to the “Settings” tab in the Application Management section to update my “Application Icon” and Organization information.
- Click the “Keys and Access Tokens” tab and locate the “Consumer Key (API Key)” and “Consumer Secret (API Secret)” values, which you can enter into the “Application Key” and “Application Secret” fields under Settings > WP Social Login > Twitter in your WordPress site admin.
You will need a “Client ID” and “Client secret” key.
- Go to https://console.developers.google.com/project
- Click “Create Project”.
- Enter the “Project Name” (I just use my website name) and click “Create”.
- Navigate to “APIs & auth” > “APIs” in the left column, then click on “Google+ API” (under Social APIs heading) and click “Enable API”.
- Next, set up your “OAuth Consent Screen” under “APIs and auth” > “Credentials”. Google will ask for some required and optional information to display on the authorization screen your users will see as part of Social Login via Google.
- After saving your Consent Screen, navigate to “APIs and auth” > “Credentials”, then click on “Add credentials” > “OAuth 2.0 client ID”.
- Select “Web application” as your application type.
- Under “Authorized redirect URLs” you need to enter the URL as provided in the Settings > WP Social Login > Google admin screen. The URL will look something like this: http://www.YOURDOMAIN.com/wp-content/plugins/wordpress-social-login/hybridauth/?hauth.done=Google
- That’s it – Google will provide you with the “client ID” and “client secret” which you can enter into the “Application ID” and “Application Secret” fields under Settings > WP Social Login > Google in your WordPress site admin.
Step 2: Install and Configure the Social Login Add On
Download and install manually via the Plugins > Add New > Upload admin page. Or, go to Memberships > Add Ons in your WordPress admin, click the “Check Now” button, then locate “Social Login” in that list.
By default, all levels will show the Social Login option, but you can choose to hide social login for a specific level on the Memberships > Membership Levels > Edit Level admin page.
What if a non-member uses Social Login via your Login page?
If you have set your WordPress Social Login Widget Advanced Settings > “Widget display” to show on the login form, it is possible for non-users/non-members to create accounts on your site.
To give these users a default membership level (i.e. a Free level like on our site), you can set the default level on the Memberships > Membership Levels > Edit Level admin page. Only one level can be set as default at a time.
Step 3: Additional Settings for WordPress Social Login (Optional)
For my setup, I updated the “Widget” tab with a few additional settings:
- I set the “Connect with caption:” to say “Login with:”.
- I removed the “Redirect URL”, set “Force Redirection” to “No” and set “Authentication display” to “Popup”.
If you’re using Memberlite, you can also use this CSS in the “Custom CSS” box: