Last Updated 24 Jul 2024
|

How To Embed Facebook Timelines in WordPress (With and Without Plugin)

Quick Summary ↪ In this article, learn how to display a Facebook timeline in WordPress step by step: Get the Facebook Page plugin > Enter your Facebook page URL > Embed the code > Install the Smash Balloon plugin > Connect your Facebook account > Add the Facebook feed and use shortcodes for custom placement.

Facebook Timeline

Do you have an audience on your Facebook community? Do you also have a constant flow of traffic coming over to your website? Great!

How about getting your A-game on and cross-promoting the two platforms?

Based on a report from Digital Marketing Community, the median Facebook engagement rate in 2020 across all industries stayed flat at 0.09%. Simply put, the rate at which your audience engages with your Facebook post has considerably reduced from what it initially was.

facebook engagement stats

(Source: Digital Marketing Community)

Good enough reason to divert some of the targeted website traffic over to your brand’s Facebook page.

WordPress doesn’t have a built-in feature to embed your Facebook timeline.

The good news is that we have several options in WordPress plugins and Facebook’s very own page plugin.

Not only will we walk you through the steps on how to display your Facebook timeline in WordPress, but we’ve also listed some of the most popular plugins to help you display them.

So, with further ado, let’s jump straight in.

Why Display Your Facebook Timeline in WordPress?

A question we keep getting asked a lot is why display Facebook timelines in WordPress? Does it really help? Why waste valuable page real estate by embedding a Facebook timeline?

Our simple answer is, why not?

Ideally, when you run an online business, you’d like to get leads and clients from just about anywhere. Be it from your website, social media, forums, groups, and anywhere you have a web presence.

With competition at an all-time high, the cost of acquiring leads is not getting any cheaper.

Sharing traffic between Facebook and your website can help generate leads and share traffic between one and the other. You never know, a few of them may even turn into customers!

Are you the kind of person who’s got an excellent website but does not update it regularly? Or find it easier just to update your Facebook page?

One more reason why you should consider displaying your Facebook timeline on your WordPress website!

How to Display a Facebook Timeline in WordPress

You can either use the page plugin option provided by Facebook or use a WordPress plugin. We’ve covered both options to help you.

Let’s start by using the Facebook Page Plugin

Step 1: Visit the Facebook Page Plugin Page

Using the page plugin, you can easily embed any Facebook page on your website.

Facebook page plugin site

Once embedded, your visitors can engage with your page just the way they do on Facebook, all from your website.

Proceed to Facebook Page Plugin.

Step 2: Enter Your Facebook Page URL

The next step is to include your Facebook page URL.

Add your facebook page URL

For instance, we’ve included the Astra Facebook page URL – https://www.facebook.com/wpastra/.

You can customize the size of your page plugin using the width and height options provided.

Step 3: Embed Code

Once you’ve customized your plugin, click on Get Code.

Facebook page generated code

You can copy the code from the JavaScript SDK or iFrame tab options.

If you opt for the JavaScript SDK option, copy the first bit of code and insert it right after the <body> tag.

If you’re comfortable with coding, you could head over to your theme editor and locate the file that includes the <body> tag. This would vary based on your theme.

For instance, you will find the <body> tag under headers.php for the standard WordPress themes. The same goes for our Astra theme.

Astra theme header php file

If you are not comfortable with coding, you could also use a WordPress plugin such as Head & Footer Code. Using this, you could exactly specify where you’d like to insert the code.

Such as with the <head> tag, just before the </body> or right after the opening <body> tag.

Once you’ve included the first bit of code, head over to Appearance > Widgets and drag a Custom HTML widget into the sidebar.

This is assuming you’d like to embed the Facebook timeline on your website sidebar.

Paste the second bit of code into the widget content area.

HTML widget to display facebook page

Once you are done, click on Save.

Your Facebook page timeline will now appear on the website side navigation.

Facebook timeline on Website

Alternate to the JavaScript SDK option is the iFrame code.

When using the iFrame code, you can skip the part where you have to insert code after the <body> tag and get straight to the point where you insert the code into the Custom HTML widget.

Add a Facebook Timeline Using a WordPress Plugin

We will make use of a popular WordPress plugin, Smash Balloon for this part.

SmashBalloon custom facebook feed pro plugin

Using this plugin, you can display unlimited feeds from your Facebook page and your Facebook Groups. You can even blend the feed to match your website’s look and feel.

Step 1: Install the Plugin

From your WordPress dashboard, head over to Plugins > Add New and activate the Smash Balloon Social Post Feed plugin.

Install Smash Balloon social feed plugin

Step 2: Connect Your Facebook Account

Once activated, head over to Facebook Feeds > Settings from your WordPress dashboard.

Custom Facebook feed setting

If you have the Facebook Page ID and Access Token handy, go ahead and enter them in the fields provided.

If you don’t, simply click on the Connect a Facebook account button.

You will now be prompted to select either a Facebook Page or a Facebook Group.

connect facebok page

Select an option and click Continue.

You will be directed to a few straightforward steps, such as selecting the page or group of your preference and confirming access to your page/group.

Once you have completed all the step-up processes, your Facebook Page ID and Access Token will be filled in automatically.

configure you facebook details

Click on Save Settings.

You can also customize your feed from the list of options provided if you scroll down a little.

customize feed

From deciding the number of posts to display to the frequency of updating the new posts, there are some self-explanatory options you could select from.

If you click on the Customize tab above, you will find some more options to play around with, such as selecting the post layout, the style posts, and much more.

Customize facebook feed

Once you are done, don’t forget to save the changes.

Step 3: Add Facebook Feed

You can add the Facebook Feed either within a page or post or in your website sidebar using a widget.

To include it within a page or post, head over to Page > Add New.

From among the blocks, add the Custom Facebook Feed to your page.

Custom Facebook feed block for Gutenberg

Once done, publish the page. You’ll notice the Facebook feed on your page.

If you want to display the Facebook timeline feed within the website sidebar, you’ll need to include a shortcode.

Head over to Appearance > Widgets and drag the Text widget to your sidebar.

Now add the shortcode [custom-facebook-feed] and click Save and then Done.

Add custom facebook feed shortcode in the widget

And just like that, you will now see your Facebook feed on the sidebar of your WordPress website.

The Best Facebook Plugins for WordPress

In addition to the Smash Balloon Social Post Feed plugin, there are a few more options that will help you easily display your Facebook timeline in WordPress.

1. 10Web Social Post Feed

10web social post feed plugin for WordPress

Integrating your WordPress website using content from your Facebook feed can’t get any simpler using the 10Web Facebook Feed plugin.

Using this plugin, you can customize the content and decide what you want to display. You have complete control over what you’d like to display from displaying an entire timeline or a specific post, link, video or photo.

Some benefits of using this plugin include:

  • Display unlimited number of feeds
  • Using the plugin’s premium version, you can filter out desired content, such as display photos, videos and albums
  • Wide range of customization options
  • Excellent customer support at your disposal

Give 10Web Facebook Feed a try!

2. Social LikeBox & Feed

Social LikeBox and Feed plugin

Social LikeBox & Feed is a highly customizable and responsive WordPress plugin that allows you to display the Facebook feed and include the Like box on your website.

The code used in the plugin is search engine friendly that helps boost your website’s organic traffic and social signals for better user engagement.

The plugin auto-updates and displays your latest Facebook content on your website.

Using the widgets and shortcodes that come with the plugin, you can incorporate the feed anywhere on your website.

Some features of this plugin include:

  • Search engines can crawl the Facebook feed content
  • Completely responsive and mobile-friendly layouts
  • Decide what to show and what to hide from your Facebook feed
  • Choose to display posts either from the page owner or from everyone who posts on your page
  • Decide on the number of Facebook posts to display
  • Multilingual translation ready

Try Social LikeBox & Feed.

3. Feed Them Social

Feed them social WordPress plugin

In addition to including your Facebook page feeds on your website, Feed Them Social WordPress plugins allow you to display feeds from other social media platforms such as Instagram, Twitter, and YouTube.

Some of the features include:

  • Include as many social feeds as you’d require
  • Display your feeds on any page, post, or sidebar
  • Use a shortcode generator to generate the shortcodes needed for any feed easily
  • Option to engage with your posts by adding a Like and Follow button anywhere on the feed

Try Feed Them Social for free!

4. Easy Social Feed

Easy social feed plugin

Want a plugin to include custom feeds from Facebook and Instagram onto your website? Easy Social Feed could be your go-to plugin.

You can easily display custom Instagram feeds such as photos and videos. You can also show Facebook feeds such as posts, status, photos, and videos on your WordPress site.

Some of the features include:

  • Option to display or hide the faces/connections
  • Option to display or hide the latest posts from the Facebook fan page
  • Use shortcodes to display a like box or even a page plugin into a page/post
  • Excellent customer support​

Install Easy Social Feed and give it a shot.

5. Widget for Social Page Feeds

Widget for social page feeds WordPress plugin

If you are looking for a straightforward and effective way to display your Facebook timeline in WordPress, you should consider the Widget for Social Page Feeds WordPress plugin.

This widget is easy to configure and lightweight, offering you attractive ways to display Facebook page likes into your website sidebar.

Some features of this plugin include:

  • Several configuration options such as the ability to show/hide posts, cover, profile photos, header, and more
  • Supports the use of shortcode
  • Responsive support team

Install Widget for Social Page Feeds for free.

How Do You Display Facebook Timelines in WordPress?

You need to get a lot of things right to build a successful online brand. From offering solutions to engaging with your audience, a lot goes into becoming a force to be reckoned with on the internet.

Cross-promoting traffic from your website to your Facebook page and vice versa is one such tactic that you can use to help. It also helps to engage with your audience and showcase your best work across multiple channels.

Displaying your Facebook timeline in WordPress is relatively straightforward. From using the native option that Facebook offers to using WordPress plugins, there are several ways you can display the Facebook timeline in WordPress.

If you haven’t embedded Facebook into your website yet, we hope this article helped.

Are you using a WordPress plugin or the Facebook page plugin option? Do let us know.

Article by
Pratik Chaskar
LinkedInTwitter

Pratik Chaskar holds the pivotal role of CTO at Brainstorm Force, serving as the backbone of the company. Renowned for his organizational skills, strategic thinking, problem-solving attitude, and expertise in leading and executing plans, Pratik plays a crucial role in the BSF’s technological landscape.

Disclosure: This blog may contain affiliate links. If you make a purchase through one of these links, we may receive a small commission. Read disclosure. Rest assured that we only recommend products that we have personally used and believe will add value to our readers. Thanks for your support!

Leave a Comment

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

Join 1,653,898+ Happy Site Owners Using Astra

Whether you are a beginner, small business owner, or professional web developer, Astra provides all the tools you need to easily build your beautiful WordPress website.

Scroll to Top