Search

How to Integrate a Facebook App into your WordPress website

Listen to this article

social-network-wordpressIf you’re looking to use a plugin which posts your WordPress website’s content to Facebook, or updates events to your Facebook calendar, chances are the plugin will ask you to create a Facebook app.

A Facebook app uses Facebook’s core technologies to post content on Facebook, integrate news feeds, add notifications, etc.

The WordPress plugin you intend to use, will eventually use the Facebook app to perform the needed tasks.

So the question is, how do you create a Facebook app and integrate it into your WordPress website?

This post aims to answer that very question. Here’s what I’ll be covering in this post:

  1. How to create a Facebook app
  2. How to test the main app before using it
  3. Integrating the app into your WordPress website
  4. Closing the loop by updating settings of the main app

Let’s take a look!

[space]

#Step 1: Create a Facebook App

To create a Facebook app, you’ll need a Facebook developer account. If you don’t have one, no worries. You could simply upgrade your personal Facebook account to a developer account. Once you’ve done that, head on over to the Facebook Developers page.

Under the ‘My Apps’ tab -> Click on ‘Add a New App’ -> then on ‘Website’ -> then enter a name for your app.

For the sake of an example, let’s name the app ‘autopublish’.

create-facebook-app

Once you’ve entered the name of the app, click on ‘Create New Facebook App ID’. You should see a pop-up. Pick the category, let’s say ‘Promotions and Contests’, and click on ‘Create App ID’. In ‘App Configuration’ add the ‘Site URL’ and ‘Mobile Site URL’ in the ‘Tell us about your website’ section. This has to be the URL of your WordPress website. Click ‘Next’.

For now, that’s all the information you’ll need.

You then need to test the app you’ve just created, before integrating it with your WordPress website.

[space]

#Step 2: Create a Test App

If you click on ‘Finished’ and then ‘Skip to Developer Dashboard’, you’ll have access to the app’s settings. You’ll notice a ‘Test Apps’ menu on the left. You can use this menu to create several test apps to test the Facebook app you’ve created.

main-facebook-app

Click on ‘Test Apps’ and then ‘Create a Test App’ (Green button on the top-right). Add a name if you have to, or just leave it as ‘autopublish – Test1’, and click ‘Create a Test App’.

Your test app will be created and you’ll receive an App ID and an App Secret key for it. Next, you need to then create a ‘Test User’.

[space]

#Step 3: Create Test Users to Test the App

A test user is a special Facebook account created to test a Facebook app. It’s invisible to others and can be created directly from within an app. So, from your test app, you’ll have to create a test user.

In your test app, go to ‘Roles’ -> ‘Test Users’ -> Add -> Set ‘Authorize Test Users for This App?’ to ‘YES’

You’ll also need to add the following permissions for the user, so app can post on to Facebook on behalf of the user. Enter the following under ‘Login Permissions’:

  • publish_actions: This is required to publish a post on behalf of the user on to his timeline.
  • user_groups: This permission is required to publish a post onto user groups on behalf of the user.
  • manage_pages: This permission is required in order to publish post on to the user’s pages on behalf of user.
  • publish_pages: This permission is required in order to publish on a user’s page on behalf of the page and not the user.

And click on ‘Create Test Users’.

Your test users will be created. You just have to do one additional thing before you can login with as the test user.

Edit the test user’s profile by clicking the ‘Edit’ button next to the user, and change the name and password for the test user. Enter a new password and save the changes made.

Now, you can log in as the test user, and create a Facebook page for the user. You can similarly create several test users and then create a Facebook group consisting of test users. Do remember to note down the Group id from the URL generated for that group.

[space]

#Step 4: Add Test App settings in WordPress

This is the easy part, because you know what you have to do here. In your plugin’s admin settings, all you need to do is enter your app ID and app secret key of the test app. Select the pages you want to post on to and enter the group ID.

wp-backend-settings

Test out if everything’s working well. If there are no issues, you just need to update the settings to that of the main app ID and you’re set.

[space]

#Step 5: Update Facebook App Settings

Update the app ID and secret key to that of the main app. In the main app enter the contact email, under the settings options and make the app live.

make-fb-app-live

[space]

Over to You

This is a sure-fire to create a Facebook app for your WordPress plugin. However, if you run into glitches along the way or have certain doubts, you can write them to me using the comment section below, and I’ll try my best to help you out! 🙂

Nirav Mehta

Nirav Mehta

Leave a Reply

Your email address will not be published. Required fields are marked *

Get The Latest Updates

Subscribe to our Newsletter

A key to unlock the world of open-source. We promise not to spam your inbox.

Suggested Reads

WordPress Development

Custom WordPress Solutions, for You

LearnDash Development

Custom LearnDash Solutions, for You

WooCommerce Development

Custom WooCommerce Solutions, for You

WordPress Plugins

Scale your WordPress Business

WooCommerce Plugins

Scale your WooCommerce Business

LearnDash Plugins

Scale your LearnDash Business

Label

Title

Subtext

Label

Title

Subtext

Join our 55,000+ Subscribers

    The Wisdm Digest delivers all the latest news, and resources from the world of open-source businesses to your inbox.

    Suggested Reads