How to setup Facebook

[ADMIN 316]

Facebook

You can allows users to sign in on your community with their Facebook account. This is a great way to make it easier for users to get started on your community and increase the number of signups. In addition, users who sign in with Facebook can have their profile photo automatically synced with Facebook and can even import their status updates and allow them to automatically share content they post on your community to Facebook. This guide covers everything you need to know to set up this integration.

Tip

If you enable either the "Allow Status Imports?" or "Users can share immediately when posting?" settings for Facebook login, make sure you read and follow the instructions in Step Five below.

 

Step One: Create a Facebook App

In order to use Facebook to log in on your community, you need to create an "application" through the Facebook Developer site. This gives Facebook some information about your community and a special key that is needed to complete the set up.

1. Go to https://developers.facebook.com/apps and sign in with your Facebook account if you are not already signed in. 
    
2. Click the button to add an app in the top-right.
   
    
3. Add in a display name (probably the same as you added above) and a contact email, along with a category appropriate to your community.
   
    
4. On the product setup screen, select 'Get Started' next to 'Facebook Login'
   
    
5. Select 'web' from the new app screen
   
    
6. Add your site URL in the space provided
   
   
    
7. Click continue through all the next screens, until you reach the following page
   
   

 

Step Two: Update App Settings

There's a few more pieces of information you need to give Facebook about your community before continuing.

1. On the dashboard for your app on Facebook's site, click the "Settings" link the sidebar.
   
2. Fill in a Contact Email and select save changes in the bottom right of the page.
   
   It is also a good idea to upload an App Icon so that when users sign in with Facebook they see your logo rather than a generic icon on the login screen. You can also set a Privacy Policy URL so users see a link to that on the sign in screen. These are normally optional, but if you intend to enable the "Allow Status Imports?" or "Users can share immediately when posting?" settings (discussed in Step Five), it is required.
   
   

 

Step Three: Link your Facebook App with your Community

Back on the dashboard for your Facebook App you will see a box like this at the top of the page:

 

You need to copy and paste the App ID and App Secret into the Admin CP on your community. Go to Admin CP -> System -> Login Handlers and click the "Edit" icon for Facebook and enter those details on that screen.
 

Tip

If you enable either the "Allow Status Imports?" or "Users can share immediately when posting?" settings for Facebook login, make sure you read and follow the instructions in Step Five below.

After saving, you need to enable the login handler. Make sure the badge next to Facebook says "Enabled", and click it to toggle if it doesn't.

 

Step Four: Enable your App

Now you need to set your Facebook App to be ready for use.

1. Back on the dashboard for your app on Facebook's site, click the "App review" link the sidebar.
   
   
2. Click the toggle to make your application live and confirm the popup.
   
   
   
   

 

Users will now be able to sign in with Facebook on your community.

 

Optional Step Five: App Review for Status Integration

When setting up Facebook login, there are two settings which, if enabled, you need to perform additional steps to set up: "Allow Status Imports?" or "Users can share immediately when posting?".

Because these settings allow your community to read from and write to the user's timeline on Facebook, Facebook requires that before you can use these features you must submit an application to them to review this functionality. If you want to enable either of these settings, you need to do the following:

1. If you have not already uploaded an App Icon and set a Privacy Policy URL as discussed in Step Two, do that now.
    
2. Enable the settings as desired and then sign in with Facebook on your site. You will see a message that some permissions have not been submitted for approval, you can ignore that warning for now and press "OK" to continue logging in.
   
    
3. If you are enabling the "Users can share immediately when posting?" setting, you need to perform this action so that Facebook knows it works correctly. Submit a topic or other content on your community and when you do so, check the "Share on Facebook" checkbox.
   
    
4. Back on the dashboard for your app on Facebook's site, click the "App review" link the sidebar.
   
   
    
5. Click "Start a Submission".
   
    
6. If you are enabling the "Allow Status Imports?" setting, check the "user_posts" checkbox.
   
    
7. If you are enabling the "Users can share immediately when posting?" setting, check the "publish_actions" checkbox.
   
    
8. Click the "Add X Items" button.
   
    
9. If you are enabling the "Allow Status Imports?" setting, click the "Add Notes" button for the "user_posts" permission and fill in the form explaining how your community will allow users to import posts from the user's timeline into the statuses feature on your community. You will need to select the "Web" platform and provide both instructions and a screencast of how Facebook can test the feature. Suggested instructions are:
    

     Quote

   1. On the home page, click "Existing User? Sign In" in the top-left and then click "Sign in with Facebook" from the dropdown.
   2. Click on your name on the top-left and then click "Profile".
   3. Click "Edit Profile" and then enable the "Enable status updates?" setting to enable the site's status update feature.
   4. Click on your name on the top-left and then click "Account Settings".
   5. Click the "Facebook" tab. Observe how your latest timeline post is saved providing context to the user.
   6. Enable the "Update my status here with my Facebook status" setting and save the form.
   7. Click the "Synchronise Now" button.
   8. Click on your name on the top-left and then click "Profile".
   9. Observe how your latest timeline post has been imported and shows alongside other content from the site.

   
    

10. If you are enabling the "Users can share immediately when posting?" setting, click the "Add Notes" button for the "publish_actions" permission and fill in the form explaining how your community will allow users to share content they create on your community to their Facebook timeline. You will need to select the "Web" platform and provide both instructions and a screencast of how Facebook can test the feature. Suggested instructions are:

      Quote

    1. On the home page, click "Existing User? Sign In" in the top-left and then click "Sign in with Facebook" from the dropdown.
    2. Click the "+Create" button in the top-left and then choose "Topic" from the dropdown.
    3. Submit a topic, making sure you check the "Share on Facebook" checkbox before submitting.

    
     

11. Upload at least 4 screenshots showing the Facebook integration on your site. For example, you might show the "Sign in with Facebook" button, the homepage after the user has signed in, the Facebook screen in Account Settings, and the "Share on Facebook" button on the topic submission screen.
    
     

12. Submit the review.
    
    

You should be advised how long the review will take. Once Facebook have approved your review, the additional features will be available on your community.