One of the common questions we get from Memberium site owners is how they can enable members to login or register through Facebook. We originally implemented Facebook Login support using the Nextend Social Login and Register plugin for a client in 2014. This guide will show you the steps needed to get this working on your site.
Benefits
- Login is usually significantly easier.
- Requires no password or username to be remembered or entered.
- If the member is already in Infusionsoft, signing in through Facebook will sync the accounts together (if the email is the same).
- If the member is new, signing in through Facebook will create the contact in Infusionsoft and WordPress automatically.
Challenges
- If the users Facebook email address does not match their Infusionsoft contact email address, the login won’t match.
- Does not allow you to automatically add or remove members from Facebook groups.
- The Memberium Support team cannot provide assistance to set up, install or troubleshoot 3rd party plugins.
Facebook login support is supported by Memberium using a third-party plugin called Nextend Social Login and Register.
Step-by-Step Setup
The first step to getting things setup is to install the plugin required to get Facebook login integrated.
Go to Plugins > Add New > and Search for “Nextend Social Login” and you’ll see the option. Go ahead and install, then activate.
Memberium Settings
There is only one setting you need to change in Memberium to make this work. Under Memberium Settings > Site Security, enable the “Sync New Registrations to Infusionsoft” option. This option will ensure that any new users who register using Facebook will automatically be created in Infusionsoft.
Get Your Facebook App & Secret ID
Next, we’ll need to set up a Facebook developer app so that we can connect our site to Facebook to authenticate users. It’s easier than it sounds, trusts me. First, go to developers.facebook.com and sign in to your Facebook account if you’re not already. Then hover over “My Apps” and click “Add a New App”
Then enter the details about your site and click “Create App ID.” The Display Name will appear when customers authenticate using Facebook so make it something appropriate for customers to see and understand.
Now, hover over Facebook Login and press “Set Up”
From here, you’ll click on “Web” and then look at the left sidebar and go to the Facebook Login settings. We’ll have to make a few changes and get some info from here.
On this page, you’ll want to add a URL specific to your site to the OAuth URIs box. This URL will not be the same for everyone as it’s site specific, but here is the format it should be. If your site was example.com the URL you should enter would be:
https://example.com/wp-login.php
If your site was members.example.com, you would enter:
https://members.example.com/wp-login.php
We have just a few more steps until we move over to WordPress. Navigate over to the Settings tab that right under Dashboard in the left sidebar. You’ll need to add 3 pieces of information.
1) Make sure the Display Name is correct and your users will recognize you by it
2) Add the link to your Privacy Policy page on your website. Create one if you don’t already have one. This is required and you cannot use the social login features without it.
3) Consider uploading an App Icon which will display with your name when users connect their Facebook account to your website.
At the top of that same page, you’ll see your App ID and your App Secret. You’ll need to copy both of these down (to a word document) as we will need them in a later step.
Lastly, head over to the App Review section and toggle the switch to Make Name Public. There will be a popup box asking you for some additional information about your site. That’s it for the Facebook part of the setup. Now we’ll move into WordPress.
Add the App & Secret ID to Nextend
At this point, you should have your App ID and App Secret ready to paste into WordPress and you’ll also need the Nextend Facebook Connect plugin installed on your site.
First, open Nextend and choose Facebook. It may say “Get Started” or “Settings” like below:
Next, you’ll be given a screen of instructions similar to the ones above.
After reviewing those, you can click the button on that page to advance to the next screen where you’ll input the App ID and Secret that you just got from Facebook.
Here’s what the screen should look like after everything is verified.
Lastly, you need to make sure that members can register through Nextend. This means that if members aren’t already members of your site, a new account can be created on the spot.
To enable this, go to Global Settings at the top, scroll down quite a bit, and enable Membership:
You’re done! Run a few tests to make sure everything works
At this point, if users go to your login page they will see an option to sign-in or register with Facebook as long as you’re using the [memb_loginform] shortcode.
