WPBeginner

Beginner's Guide for WordPress

  • Blog
    • Beginners Guide
    • News
    • Opinion
    • Showcase
    • Themes
    • Tutorials
    • WordPress Plugins
  • Start Here
    • How to Start a Blog
    • Create a Website
    • Start an Online Store
    • Best Website Builder
    • Email Marketing
    • WordPress Hosting
    • Business Name Ideas
  • Deals
    • Bluehost Coupon
    • SiteGround Coupon
    • WP Engine Coupon
    • HostGator Coupon
    • Domain.com Coupon
    • Constant Contact
    • View All Deals »
  • Glossary
  • Videos
  • Products
X
☰
Beginner's Guide for WordPress / Start your WordPress Blog in minutes
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
Recommended
WordPress Plugins
View all Guides

WPBeginner» Blog» Tutorials» How to Display Your Facebook Timeline in WordPress

How to Display Your Facebook Timeline in WordPress

Last updated on August 17th, 2020 by Editorial Staff
177 Shares
Share
Tweet
Share
Pin
Free WordPress Video Tutorials on YouTube by WPBeginner
How to Display Your Facebook Timeline in WordPress

Do you want to show your Facebook timeline posts on your website?

By adding your Facebook updates to your website, you can keep users updated with real-time status and even boost your Facebook following.

In this article, we’ll show you how to easily display your Facebook timeline in WordPress.

Displaying your Facebook timeline in WordPress

Video Tutorial

Subscribe to WPBeginner

If you’d prefer written instructions, just keep reading.

Displaying Your Facebook Timeline in WordPress

We’re going to use Smash Balloon’s Custom Facebook Feed Pro to add our Facebook timeline to our WordPress website.

First, you need to go to the Smash Balloon website and download the Custom Facebook Feed Pro plugin.

Next, you need to install and activate the plugin on your site. For more details, see our step by step guide on how to install a WordPress plugin.

Note: There’s also a free version of the plugin, called Smash Balloon Social Post Feed. This works fine to display text and links from your timeline. However, it will not show photos.

Upon activation, go to Facebook Feed » Settings in your WordPress dashboard. Here, you will need to connect your Facebook account.

Connect your Facebook account to the Custom Facebook Feed plugin

Next, you need to decide whether to display a Facebook page or group timeline. We’re going to use our Facebook page.

Note: You cannot display a timeline from your personal profile. This is due to Facebook’s privacy policy.

Continue connecting Facebook Feed Pro to Facebook

Facebook will then prompt you to agree and give Smash Balloon permission to access your Facebook account. Simply follow the on-screen prompts.

You will then see the Custom Facebook Feed Settings page again, with a popup asking you to select which page to use. Click on the page you want, and then click the ‘Connect this page’ button:

Select the Facebook page that you want to connect to your website

You should now see your page listed in the ‘Connected Accounts’ section of the Custom Facebook Feed configuration settings. Don’t forget to click the ‘Save Settings’ button to save it.

Make sure you click the button to save changes to your settings

Now, it’s time to go ahead and add the Facebook timeline from your page to your site. Simply open up the post or page where you want to put your timeline, or create a new post or page.

It’s also possible to add your timeline to your WordPress sidebar, which we’ll cover later in this tutorial.

We’re going to create a new page by going to Pages » Add New. On the page edit screen, click on the (+) icon to add the Custom Facebook Feed block in the WordPress block editor:

Adding the Facebook feed block to a page

You can see the preview of your Facebook feed straight away in the content editor. Go ahead and preview or publish your page to check it out on your site. Here’s our Facebook timeline:

Our Facebook page timeline displaying on our WordPress page

We’ve added some styling to our timeline to make it look great on our site. Next, we’ll take a look at how to customize your own Facebook timeline using Custom Facebook Feed Pro.

Customizing Your Facebook Timeline with Smash Balloon Facebook Feed Pro

Custom Facebook Feed Pro lets you change all sorts of options about your timeline. Let’s go through some of the key ones.

Simply go to the Facebook Feed » Settings page in your WordPress dashboard.

Scroll down to the ‘Settings’ section, and you’ll see a few key options. For instance, you might decide you only want to display 5 posts:

Changing the number of posts shown in the Facebook timeline on the website

There are also lots of settings under the Facebook Feed » Customize page that you may want to try out. This page gives you lots of different options to choose from in different tabs.

The Customize options for the Custom Facebook Feed plugin

To change how your timeline is laid out, simply click the ‘Post Layout’ tab. We’ve selected the ‘Half-width’ style for our posts at the top here. Don’t forget to click the ‘Save Changes’ button after making any changes:

Using half-width posts for the Facebook timeline

Next, go to the ‘Style Posts’ tab to change how your posts are styled. We think the ‘Boxed’ style here looks great. We’ve given our posts rounded corners plus a shadow:

Changing how the Facebook posts are styled in the timeline by adding a box and rounded corners

Again, make sure you save your changes before leaving the page.

Adding Your Custom Facebook Timeline in WordPress Sidebar

What if you want to display your Facebook timeline in your sidebar instead of in a post or page? You can easily do that with Custom Facebook Feeds.

First, go to the Appearance » Widgets page in your WordPress admin area. Then, drag a ‘Text’ widget to wherever you want your timeline within your sidebar. Now, simply enter the shortcode [custom-facebook-feed] in the widget and save it.

Adding a custom Facebook feed to a widget

Your Facebook timeline will now appear in the sidebar on your website:

Viewing the Facebook timeline in your sidebar

We hope this article helped you learn how to display your Facebook timeline in WordPress. You might also want to check out our articles on easy ways to increase your blog traffic and the best WordPress plugins.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

177 Shares
Share
Tweet
Share
Pin
Popular on WPBeginner Right Now!
  • Checklist

    Checklist: 15 Things You MUST DO Before Changing WordPress Themes

  • Google Analytics in WordPress

    How to Install Google Analytics in WordPress for Beginners

  • How to Fix the Error Establishing a Database Connection in WordPress

    How to Fix the Error Establishing a Database Connection in WordPress

  • How to Start Your Own Podcast (Step by Step)

    How to Start Your Own Podcast (Step by Step)

About the Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi. Trusted by over 1.3 million readers worldwide.

The Ultimate WordPress Toolkit

10 Comments

Leave a Reply
  1. Viane says:
    Oct 8, 2020 at 10:51 pm

    Wow! Thank you for this!

    Reply
    • WPBeginner Support says:
      Oct 9, 2020 at 10:21 am

      You’re welcome :)

      Reply
  2. Anitha says:
    Oct 1, 2020 at 5:14 pm

    Wow! I didn’t even know this was possible. Thank you for sharing this

    Reply
    • WPBeginner Support says:
      Oct 2, 2020 at 9:20 am

      You’re welcome :)

      Reply
  3. Shahnewaj Islam Tamil says:
    Oct 1, 2020 at 1:17 pm

    Both the plugin & this article is really amazing!

    Reply
    • WPBeginner Support says:
      Oct 2, 2020 at 9:07 am

      Glad you like our recommendation and content :)

      Reply
  4. Nabeel says:
    Aug 18, 2020 at 4:21 pm

    This is really awesome plugin to add Facebook feed at WordPress website in footer area or in widget area to show your Facebook feeds and activities at your WordPress website. thanks to developer.

    Reply
    • WPBeginner Support says:
      Aug 19, 2020 at 11:05 am

      Glad you like the recommended plugin :)

      Reply
  5. Amanda Burroughs says:
    Aug 18, 2020 at 11:17 am

    Thank you for this tutorial! Can only the events from the FB page be displayed?

    Reply
    • WPBeginner Support says:
      Aug 19, 2020 at 10:51 am

      Yes, events on your page can be displayed :)

      Reply

Leave a Reply Cancel reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

Over 1,320,000+ Readers

Get fresh content from WPBeginner

Featured WordPress Plugin
SeedProd Logo
SeedProd
Create beautiful custom landing pages - Drag & drop builder. Learn More »
How to Start a Blog How to Start a Blog
I need help with ...
Starting a
Blog
WordPress
Performance
WordPress
Security
WordPress
SEO
WordPress
Errors
Building an
Online Store
Useful WordPress Guides
    • 7 Best WordPress Backup Plugins Compared (Pros and Cons)
    • How to Fix the Error Establishing a Database Connection in WordPress
    • Why You Need a CDN for your WordPress Blog? [Infographic]
    • 30 Legit Ways to Make Money Online Blogging with WordPress
    • Self Hosted WordPress.org vs. Free WordPress.com [Infograph]
    • Free Recording: WordPress Workshop for Beginners
    • 24 Must Have WordPress Plugins for Business Websites
    • How to Properly Move Your Blog from WordPress.com to WordPress.org
    • 5 Best Contact Form Plugins for WordPress Compared
    • Which is the Best WordPress Popup Plugin? (Comparison)
    • Best WooCommerce Hosting in 2020 (Comparison)
    • How to Fix the Internal Server Error in WordPress
    • How to Install WordPress - Complete WordPress Installation Tutorial
    • Why You Should Start Building an Email List Right Away
    • How to Properly Move WordPress to a New Domain Without Losing SEO
    • How to Choose the Best WordPress Hosting for Your Website
    • How to Choose the Best Blogging Platform (Comparison)
    • WordPress Tutorials - 200+ Step by Step WordPress Tutorials
    • 5 Best WordPress Ecommerce Plugins Compared
    • 5 Best WordPress Membership Plugins (Compared)
    • 7 Best Email Marketing Services for Small Business (2020)
    • How to Choose the Best Domain Registrar (Compared)
    • The Truth About Shared WordPress Web Hosting
    • When Do You Really Need Managed WordPress Hosting?
    • 5 Best Drag and Drop WordPress Page Builders Compared
    • How to Switch from Blogger to WordPress without Losing Google Rankings
    • How to Properly Switch From Wix to WordPress (Step by Step)
    • How to Properly Move from Weebly to WordPress (Step by Step)
    • Do You Really Need a VPS? Best WordPress VPS Hosting Compared
    • How to Properly Move from Squarespace to WordPress
    • How to Register a Domain Name (+ tip to get it for FREE)
    • HostGator Review - An Honest Look at Speed & Uptime (2020)
    • SiteGround Reviews from 4196 Users & Our Experts (2020)
    • Bluehost Review from Real Users + Performance Stats (2020)
    • How Much Does It Really Cost to Build a WordPress Website?
    • How to Create an Email Newsletter the RIGHT WAY (Step by Step)
    • Free Business Name Generator (A.I Powered)
    • How to Create a Free Business Email Address in 5 Minutes (Step by Step)
    • How to Install Google Analytics in WordPress for Beginners
    • How to Move WordPress to a New Host or Server With No Downtime
    • Why is WordPress Free? What are the Costs? What is the Catch?
    • How to Make a Website in 2020 – Step by Step Guide
Deals & Coupons (view all)
MemberPress
MemberPress Coupon
Get up to 50% OFF on MemberPress WordPress premium membership plugin.
AccessPress Themes
AccessPress Themes Coupon
Get 15% off on AccessPress Themes collection of premium WordPress themes and plugins.
Featured In
About WPBeginner®

WPBeginner is a free WordPress resource site for Beginners. WPBeginner was founded in July 2009 by Syed Balkhi. The main goal of this site is to provide quality tips, tricks, hacks, and other WordPress resources that allows WordPress beginners to improve their site(s).
Join our team: We are Hiring!

Site Links
  • About Us
  • Contact Us
  • FTC Disclosure
  • Privacy Policy
  • Terms of Service
  • Free Blog Setup
  • Free Business Tools
Our Sites
  • OptinMonster
  • MonsterInsights
  • WPForms
  • SeedProd
  • Nameboy
  • RafflePress
  • Smash Balloon

Copyright © 2009 - 2021 WPBeginner LLC. All Rights Reserved. WPBeginner® is a registered trademark.

Managed by Awesome Motive | WordPress hosting by SiteGround | WordPress CDN by MaxCDN | WordPress Security by Sucuri.