ADVANCED PLAN + 


NOTE: As of MARCH 29, 2017, the Facebook PHP client library requires a minimum PHP version of 5.4. The PHP configuration also requires that the timezone be explicitly set.  If you are setting directly in the php.ini file, a Central Timezone setting would look like this:  

date.timezone = "US/Central"


The MemberMouse Facebook login extension will allow your customers to create a new membership using their Facebook login credentials.


Creating A Facebook App

The first step to enabling the Facebook login extension on your site is to create a Facebook App. To create your app, follow these steps:

  1. To access the developers page of Facebook visit http://developers.facebook.com/apps. This is the page where Facebook lists down a list of applications that you have already created with them. On the top right corner, click on Add a New App:



  2. Facebook will prompt you for an application name:


  3. Under Select a Scenario click the option next to Integrate Facebook Login and then Confirm:



  4. Under Settings on the left, click Basic. Fill and save the form (scrolling down to fill in the GDPR section if required), replacing the fields shown with the appropriate information for your site, and upload an app icon.


  5.  Scroll to the bottom of the Basic Settings page and create a platform by clicking the +Add Platform button:




  6.  Select Website:





  7. Add your website URL, and save your settings.


  8. Your app has now been created, and you will be taken to the main settings page.  From here click to expand Facebook Login on the left hand side, and click Settings. Check to make sure your toggle switches match the ones shown below, and copy/paste the Valid OAuth Redirect URI here, modifying yoursite.com to match your MemberMouse domain, and click Save Changes:  https://yoursite.com/wp-content/plugins/membermouse/lib/hybridauth/?hauth_done=Facebook



  9.  Your app is now configured, but it is not live just yet:





  10. To make your app live, click the toggle switch to the ON position, select your category, then Confirm:




  11. Your app has now been created. You will need to access the App ID and App Secret to configure the extension on your site.  These are accessible from Settings > Basic:




  12. Open up a new tab on your web browser, and move to configuring the Facebook Login Extension:


Configuring The Facebook Login Extension


To enable the Facebook login extension, follow the steps below:

  1. In the MemberMouse menu, click on General Settings.

  2. Next, click on the Extensions tab and from the following page, click on the Facebook logo.

  3. You will need to provide some information from your Facebook app, as well as make a few selections:





    App ID - From your Facebook app dashboard.
    App Secret
    - From your Facebook app dashboard.
    Allow Signups?
    - If you want to allow new customers to sign up using their Facebook login credentials, then click this box. Otherwise, members will only be able to login using their Facebook credentials, but not sign up for a new membership.
    Membership Level - Customers can only signup for a free membership level when they are using their Facebook login credentials. Once they are members, they can purchase a paid membership. You need to select the default free membership you would like customers to join when using Facebook.
    Callback URL:
    - This is the URL that is used in the Facebook App.


  4. Click Save Configuration.


Adding Facebook Signup And Login To Your Site





Once you have configured your site to accept Facebook login, you need to add the following SmartTags to allow for signup and login:

Signup Button SmartTag


The following SmartTag generates a button that customers can use to sign up for a new account:

[MM_Social_Signup_Button provider='Facebook']

Attributes:

provider - Set the provider attribute to all to generate signup buttons for all active social login providers, or you can use an individual tag for each provider Twitter, Facebook and Google. For example:

[MM_Social_Signup_Button provider='all']


Optional Attributes:
 
membershipLevel - You can optionally use this attribute to override the default signup membership level
defined above. It takes a membership level ID for free membership levels only. For example:

[MM_Social_Signup_Button provider='Facebook' membershipLevel='2']

Read this article to learn how to find your membership level IDs.



Login Button SmartTag


The following SmartTag generates a button that customers can use to log into an existing account:


[MM_Social_Login_Button provider='Facebook']


Attributes:

provider - Set the provider attribute to all to generate signup buttons for all active social login providers, or you can use an individual tag for each provider Twitter, Facebook and Google. For example:

[MM_Social_Login_Button provider='all']


MM_Form Section Update


If you installed MemberMouse prior to version 2.2.0, and you want to use the SSO extension, you will also need to add the code below to your login core page (read this article to learn more about the login core page)

[MM_Form_Section type='socialLogin']
<div id="mm-social-login-section" class="mm-myaccount-module">
    <div id="mm-social-login-header" class="mm-myaccount-module-header">
        Social Networks
    </div>
    <div class="mm-myaccount-content-wrapper">
    <div id="mm-social-login-body">
        [MM_Form_Data name='socialLogin']
    </div>
       </div>
</div>
[/MM_Form_Section]

This is only for customers who have a version of MemberMouse prior to version 2.2.0.