How to Add Facebook Feed to WordPress?

How to Add Facebook Feed to WordPress?

Instead of linking to your business Facebook Page from a website, why not just insert the Facebook page feed into a webpage where visitors can see the latest status updates, videos and photos without leaving your website? Usually there are two kinds of embeddable feeds, including “Activity Feed” and “Recommendations Feed”.

This comprehensive guide will teach you how to add Facebook Feed to website to improve user experience and maximize online presence. Both the manual and automatic methods are covered, and we will take the example of WordPress here.

Manual Method – Using Facebook “Page Plugin”

Assuming that you’ve set up a Facebook page, following are the steps to embed the Facebook feed to your WordPress website:

  1. First of all, go to this page and then mouse over the “Page Plugin” option from “Social Plugins” section. In the past, many webmasters also choose to use the “Like Box” option, which is however deprecated since the release of Graph API v2.3.
  2. Like Box Is Deprecated

  3. As shown, enter the URL of your Facebook page inside the box and then specify other preferences. Note that, the “Width” cannot be more than 500 and the “Height” is set to 427 pixels by default. Do check this option that says “Show Page Posts” there.
  4. Enter Facebook Page Information

  5. Once done, press “Get Code” button and choose a specific code type from this pop-up window. For demonstration purpose, we choose the second one here.
  6. Get Facebook Page Code

  7. The last step is to log in your WordPress account and head to “Appearance” > “Widgets”. From here, drag and drop this “Text” widget to the needed widget area on the right hand. Right-click on it and paste the “Facebook Plugin Code” in the blank box. Be sure to enter a name before clicking “Save” button.
  8. Paste Facebook Plugin Code

Automatic Method – Using Custom Facebook Feed

Another simple way to display your Facebook feed within WordPress is through a plugin named “Custom Facebook Feed”. It includes a rich list of features by which you can display a customizable and search-friendly version of Facebook Feed on your website. Before getting into its specific options, just install it via the following URL or the plugin repository.

Plugin URL:

About Custom Facebook Feed Plugin

Once completed, choose it from those “Installed Plugins” and enter the “Settings” page directly. This section is sorted into three categories, and you actually only need to make customizations to the “Configuration” and “Customize” tabs.

Part 1 – Configuration

Firstly, you will be prompted to enter the ID and “Access Token” of the Facebook page. Below is the “Settings” area where you can specify how much posts will be displayed, set the “Post Limit” and display a group or profile as well. Depending on personal needs, it’s possible to customize the “Localization” and “Time Zone” there.

Set Facebook Feed Configuration

If you’re happy with the above settings, just copy and paste the [custom-facebook-feed] shortcode to anywhere you want the feed to show up.

Part 2 – Customize

Here comes the important “Customize” section that is sub-divided into five options, among which this “General” tab enables you to personalize the feed width, feed height, feed padding and feed background color. As shown, each of them comes with different requirements, and you can add multiple classes to separate them with a space.

Set Facebook General Settings

The next section is “Post Layout” where you can only show/hide some options, such as “Author Name”, “Shared Links”, “Event Title”, “Event Details”, “View on Facebook” and “Post Text”, etc. The details of each option are available inside the “Typography” area, but a few features are blocked from the free version. For instance, you’re allowed to customize:

  • Feed Header is where to adjust text background color, text weight, text size, icon type, icon color and icon size. You also have an option to show the feed outside the scrollable area.
  • Shared Links is where to set the link title size, link title color, link URL color, link box border/background color.
  • View on Facebook is where to choose” Share” text, enable “View on Facebook” link and display “Share” link.
  • Post Text is where to enable link text to Facebook post and link post tags. The link color is also editable.

Set Facebook Post Layout

The remaining options allow you to re-configure the styling of the posts, add custom text and even display Facebook like button in WordPress. To access more advanced features blocked by the Pro version, you should purchase a license that costs a minimum of $49 per year.

Buy Custom Facebook Feed Pro Version