Difference between revisions of "Configuring Sign-In using Facebook"

From WHMCS Documentation

(Updated facebook steps)
Line 1: Line 1:
This article is part of the [[Sign-In Integrations]] feature.
+
Enabling the Facebook® [[Sign-In Integrations]] enables visitors and customers to register, sign in, and connect their Facebook accounts with your WHMCS installation for faster signup and automatic sign-in.
 
 
==Purpose==
 
 
 
Enabling the Facebook Sign In Integration enables visitors and customers to register, sign in and connect their Facebook accounts with your WHMCS installation for faster sign-up and automatic sign-in.
 
  
 
[[File:Signinintegrationslogin.png]]
 
[[File:Signinintegrationslogin.png]]
  
==Configuring Sign-In with Facebook==
+
== Configuring Sign-In with Facebook ==
 
 
There are 3 steps required to setup Sign-In with Facebook:
 
 
 
# Create a Facebook App
 
# Retrieve the App Credentials
 
# Activate within WHMCS
 
 
 
===Creating a Facebook App===
 
Facebook Sign-In Integration requires a Facebook app. You can create this using your existing Facebook account. Users will only see the app name you define and not see anything relating to the account you use to create the app.
 
<div class="docs-alert-warning">Please be aware that the Facebook account under which you create the app cannot be changed without requiring users to reauthenticate and re-link their accounts. Therefore it is important to create the app under an account that you will always have access to.</div>
 
1. Visit https://developers.facebook.com/apps/.
 
 
 
2. If not logged in, log in to your Facebook account.
 
 
 
3. Click "'Create App'".
 
 
 
[[File:Facebook-1.png]]
 
 
 
4. Select '''Consumer''' as the app type.
 
 
 
[[File:Facebook-2.png|600px|border]]
 
 
 
5. Click '''Continue'''.
 
 
 
6. Enter an '''App Display Name'''. This is the name people will see when authorising your app. We recommend using your company name here.
 
 
 
7. Enter an '''App Contact Email'''. This email will be used for important communication about your app.
 
 
 
[[File:Facebook-3.png|600px|border]]
 
 
 
8. Click '''Create App'''.
 
 
 
9. Locate the '''Facebook Login''' option and click '''Set Up'''.
 
 
 
[[File:Facebook-4.png|600px|border]]
 
 
 
10. Select '''Web''' when asked which platform you require.
 
 
 
[[File:Facebook-5.png|600px|border]]
 
 
 
11. Provide the URL of your website. You must enter the full URL to the root domain of your website. In the example below, we have entered https://demo.whmcs.com/.
 
 
 
[[File:Facebook-6.png|600px|border]]
 
 
 
12. Click '''Save'''.
 
 
 
13. Click '''Continue'''.
 
 
 
<div class="docs-alert-info">The remaining steps provide information intended for developers who are integrating Facebook login for the first time. We've performed the integration work so this can be skipped.</div>
 
 
 
14. Choose the '''Settings''' menu and then select '''Basic'''.
 
  
[[File:Facebook-7.png|800px|border]]
+
Facebook Sign-In Integration requires a Facebook app. You can create this using your existing Facebook account. Users will only see the app name you define and will not see anything relating to the account you use to create the app.
  
15. Provide your "App Domains". This must be the same domain you provided in Step 11.
+
<div class="docs-alert-warning">
 +
You can't change the Facebook account under which you create the app without requiring users to reauthenticate and re-link their accounts.
 +
</div>
  
16. Provide a '''Privacy Policy URL'''.
+
To set up sign-in with Facebook:
  
17. Complete '''User Data Deletion'''.
+
# Create a Facebook App.
 
+
## Visit [https://developers.facebook.com/apps/ the Facebook developer portal].
18. Provide a  '''Terms of Service URL'''.
+
## Log in to your Facebook account.
 
+
## Click "'Create App'". [[File:Facebook-1.png]]
19. Provide a '''Category'''. Typically, this would be '''Business and Pages'''.
+
## Select '''Consumer''' as the app type. [[File:Facebook-2.png|600px|border]]
 
+
## Click '''Continue'''.
20. Click '''Save Changes'''.
+
## Enter an '''App Display Name'''. This is the name people will see when authorizing your app. We recommend using your company name here.
 
+
## Enter an '''App Contact Email'''. This email will be used for important communication about your app. [[File:Facebook-3.png|600px|border]]
21. Toggle the '''App Mode''' switch at the top to '''Live'''.
+
## Click '''Create App'''.
 
+
## Locate '''Facebook Login''' and click '''Set Up'''. [[File:Facebook-4.png|600px|border]]
[[File:Facebook-8.png|600px|border]]
+
## Select '''Web''' as your platform. [[File:Facebook-5.png|600px|border]]
 
+
## Enter the full URL to the <tt>root</tt> domain of your website. [[File:Facebook-6.png|600px|border]]
====Permissions====
+
## Click '''Save'''.
 
+
## Click '''Continue'''.
1. Choose the '''App Review''' menu and then select '''Permissions and Features'''.
+
# Configure the required permissions.
 
+
## From the '''App Review''' menu, select '''Permissions and Features'''.
2. Locate the '''public_profile''' option and click '''Get Advanced Access'''.
+
## Locate the '''public_profile''' option and click '''Get Advanced Access'''. [[File:Facebook-9.png|800px|border]]
 
+
##  Agree to the request and click '''Confirm'''.
[[File:Facebook-9.png|800px|border]]
+
# Retrieve the App Credentials.
 
+
## Navigate to the Dashboard.
3. Agree to the request and click '''Confirm'''.
+
## From the '''Settings''' menu, select '''Basic'''.
 
+
## Click '''Show''' to view the App ID and Secret. [[File:Fb10.png]]
===Retrieving the App Credentials===
+
# Activate the app within WHMCS.
 
+
# Log in to the WHMCS Admin Area.
To retrieve the credentials for the app you just created, follow the steps below.
 
 
 
1. Navigate to the Dashboard<br>
 
2. Select the '''Settings''' menu and select '''Basic'''<br>
 
3. The App ID and Secret are shown here. The App Secret is masked by default. Click the ''Show'' button to reveal it.<br>
 
 
 
[[File:Fb10.png]]
 
 
 
===Activating within WHMCS===
 
 
 
# Login to the WHMCS Admin Area
 
 
# Navigate to '''Configuration (<i class="fa fa-wrench" aria-hidden="true"></i>) > System Settings > Sign-In Integrations''' or, prior to WHMCS 8.0, '''Setup > Sign-In Integrations'''.
 
# Navigate to '''Configuration (<i class="fa fa-wrench" aria-hidden="true"></i>) > System Settings > Sign-In Integrations''' or, prior to WHMCS 8.0, '''Setup > Sign-In Integrations'''.
# Select Activate under the Facebook heading
+
# Select '''Activate''' under the Facebook heading.
# Enter your Facebook App ID and your Facebook App Secret where requested
+
# Enter your Facebook App ID and your Facebook App Secret.
# Click Save & Activate
+
# Click '''Save & Activate'''.
 
 
WHMCS will attempt to validate and test the details you have entered. Assuming the App ID and Secret are valid and successfully authenticate with the Facebook API, the values will be saved and the modal will close.
 
  
Congratulations! Facebook Sign In is now enabled.
+
WHMCS will attempt to validate and test the details you have entered. If the App ID and Secret are valid and successfully authenticate with the Facebook API, the values will be saved.
  
 
==Troubleshooting==
 
==Troubleshooting==
  
 
For troubleshooting help, please refer to [[Troubleshooting Sign-In using Facebook]]
 
For troubleshooting help, please refer to [[Troubleshooting Sign-In using Facebook]]

Revision as of 14:09, 10 September 2021

Enabling the Facebook® Sign-In Integrations enables visitors and customers to register, sign in, and connect their Facebook accounts with your WHMCS installation for faster signup and automatic sign-in.

Signinintegrationslogin.png

Configuring Sign-In with Facebook

Facebook Sign-In Integration requires a Facebook app. You can create this using your existing Facebook account. Users will only see the app name you define and will not see anything relating to the account you use to create the app.

You can't change the Facebook account under which you create the app without requiring users to reauthenticate and re-link their accounts.

To set up sign-in with Facebook:

  1. Create a Facebook App.
    1. Visit the Facebook developer portal.
    2. Log in to your Facebook account.
    3. Click "'Create App'". Facebook-1.png
    4. Select Consumer as the app type. Facebook-2.png
    5. Click Continue.
    6. Enter an App Display Name. This is the name people will see when authorizing your app. We recommend using your company name here.
    7. Enter an App Contact Email. This email will be used for important communication about your app. Facebook-3.png
    8. Click Create App.
    9. Locate Facebook Login and click Set Up. Facebook-4.png
    10. Select Web as your platform. Facebook-5.png
    11. Enter the full URL to the root domain of your website. Facebook-6.png
    12. Click Save.
    13. Click Continue.
  2. Configure the required permissions.
    1. From the App Review menu, select Permissions and Features.
    2. Locate the public_profile option and click Get Advanced Access. Facebook-9.png
    3.  Agree to the request and click Confirm.
  3. Retrieve the App Credentials.
    1. Navigate to the Dashboard.
    2. From the Settings menu, select Basic.
    3. Click Show to view the App ID and Secret. Fb10.png
  4. Activate the app within WHMCS.
  5. Log in to the WHMCS Admin Area.
  6. Navigate to Configuration () > System Settings > Sign-In Integrations or, prior to WHMCS 8.0, Setup > Sign-In Integrations.
  7. Select Activate under the Facebook heading.
  8. Enter your Facebook App ID and your Facebook App Secret.
  9. Click Save & Activate.

WHMCS will attempt to validate and test the details you have entered. If the App ID and Secret are valid and successfully authenticate with the Facebook API, the values will be saved.

Troubleshooting

For troubleshooting help, please refer to Troubleshooting Sign-In using Facebook