How to Embed a Custom Facebook Feed on WordPress [Easy]
Home Blog How to Embed a Custom Facebook Feed on WordPress [Easy]

How to Embed a Custom Facebook Feed on WordPress [Easy]

Looking for an easy way to display your Facebook feed on your WordPress?

Showing your custom Facebook feed on your website can help you connect with your audience and grow your Facebook page.

With over 2.5 billion users, Facebook is still the undefeated social media champion.

But Facebook doesn’t give a simple way to embed your Facebook feed on your website.

We at Smash Balloon have helped over 1.75 million users display their social media content, like Facebook feeds, on their WordPress websites.

In this step-by-step guide, we’ll show you the easiest way to add your Facebook feed to WordPress. By following our tutorial, you can set up and display your Facebook feed in under 5 minutes!

Let’s dive in.

Should You Use a Facebook Page Plugin for WordPress?

In adding your Facebook business page feed to your WordPress site, you have 2 choices. You can use Facebook’s Page plugin, but it comes with a few restrictions:

  • Limited customization choices: If you want your Facebook feed to inherit the style that your website’s theme uses, it’s not possible. Unless you hire an expensive developer to fix the code for you.
  • Basic tabs only: You can only show your Facebook feed’s timeline. No option to control which Facebook posts you want to show as well.
  • Overwhelming, especially for beginners: You’d need to get the embed code from the share button and tweak it to customize how your feed looks so it gets confusing. Plus, you need to deal with code to add your Facebook feed to WordPress, too.
how to add facebook feed to wordpress website

Finally, when you take the risk and use it to hopefully add your Facebook feed to WordPress, you risk accidentally breaking your site.

The most frustrating part? There’s no support team who can help you. You’re on your own, so it’s difficult especially if you’re not a techie.

Or, how about doing the 2nd option?

Choose the easiest way to show your Facebook feed on your WordPress website.

What’s the Easiest Way to Add Facebook Feeds to WordPress?

You can install an easy-to-use WordPress plugin like Facebook Feed Pro to help you. It’s the best WordPress feed plugin that lets you display customizable Facebook feeds on your website, no technical knowledge needed.

custom facebook feed pro homepage

Facebook Feed Pro is the best Facebook feed plugin in the market. It extends your WordPress site’s functionality to display Facebook content on your website in just a few clicks.

Since it’s designed with users in mind, the plugin is both user-friendly and ultra-fast. That way, your website will be light and fast to load as well.

And with a faster site, you also get improved SEO.

Here are some more amazing features from this Facebook feed WordPress plugin:

  • Save time and effort: Embedding your Facebook posts on your site lets you show updated content to your site visitors each time you upload new posts on Facebook — with no extra effort on your part.
  • Super easy to set up: You can display your WordPress Facebook feed in under 30 seconds, so you can get more likes in Facebook right away.
  • Consistent with your branding: The plugin looks great out of the box. It automatically copies your existing WordPress themes’ style to keep up with your brand’s visuals.
  • Lots of Facebook content choices: Using the plugin, you can show your posts from your page, as well as events feed, Facebook video playlists, and photos to boost user engagement.
carousel facebook video feed
  • Social Proof: You can even embed Facebook reviews and testimonials and use that social proof to show people that real people out there are using your products.
  • Live Feed Customizer: The plugin has a live feed editor so you can see your customizations in real-time.
  • Simple and straight-to-the-point: Want to change your Facebook feed’s background color? Font size? Or header? You can do all these with Facebook Feed Pro’s visual feed customizer in just a few clicks.

As the most popular Facebook feed plugin for WordPress, Facebook Feed Pro is trusted by over 250,000 users with a solid 4.9/5 star rating.

reviews for custom facebook feeds pro

Want to know what else Facebook Feed Pro can do for your brand? Check out the plugin’s full list of features here.

Ready to supercharge your Facebook page’s growth and get more conversions with effective social media marketing?

Follow the steps below to add your Facebook feed to your website today.

Step 1: Install the Facebook Feed Pro Plugin

To begin adding your social media content from Facebook to your WordPress website, get your own copy of Facebook Feed Pro here.

Once you’ve downloaded the plugin to your computer, the next step is uploading it to your website and activating it.

Need some help doing this? You can check out this helpful step-by-step tutorial on how to install a WordPress plugin.

Step 2: Create and Choose Your Facebook Feed

After installing and activating the plugin on your website, go to the Facebook Feed » All Feeds menu from your WordPress admin dashboard

To create feeds using Facebook Feed Pro, click on Add New.

add new feed with custom facebook feed pro

Then, you’ll see lots of Facebook feed types available for you to create, such as timeline feed, photos feed, Facebook events, videos feed, Facebook albums feed, and more.

In this tutorial, we’ll show a Facebook timeline feed, so choose Timeline and then click on Next.

pick timeline

Step 3: Connect to Your Facebook Page

Now that you’ve selected your Facebook feed type, the next step is connecting your source for your Facebook feed to the plugin.

Sources are Facebook pages that your feed will get posts, photos, or videos from.

To get started, look for Select a Source section and click on the Add New button.

add new source for facebook feed

Next, you’ll see a popup asking you to choose between connecting a Page or Group from Facebook. Once you’ve chosen, make sure to click on the Connect button.

In this tutorial, we’ll embed a Facebook page feed.

pick between group or page for facebook feed

You’ll now be redirected to Facebook. Simply pick the page that you want to show on your website, and then click on Next.

select facebook page

Next, the plugin will ask for read-only access to your Facebook account.

No need to worry. Since it’s read-only access, the plugin can’t actually change anything — it’ll only read your data so Smash Balloon is super safe to use.

Simply click on Done to finalize the page connection.

what is smash balloon allowed to do

Now, you’ll see the list of Facebook pages you have access to. Wasn’t that easy? You didn’t even need to paste your Facebook page URL because the plugin automatically shows you the pages connected to your account.

Here, choose the Facebook page you want to connect to and click on Add.

add new source confirmation

Congratulations! You can now select this Facebook page as a source for your WordPress Facebook feed. Remember to click on Next to proceed to the next step below.

pick your source for custom facebook feed pro

Step 4: Customize Your Facebook Feed

After you’ve connected to a Facebook page, the next step is customizing your Facebook feed using the plugin’s live feed customizer.

First, you can add a name to your Facebook feed so you can easily identify it from the others.

add name to your facebook feed

You can also control how your Facebook feed looks like on your website — without touching a single line of code.

On the left side, you’ll see tons of customization options for your Facebook feed, such as feed type, feed layout, color scheme, header, posts, Facebook like box and more.

Every time you customize your Facebook feed, you can view the right side to see the changes in real-time.

For example, to customize your Facebook feed layout, click on the Feed Layout option.

facebook feed layout

Then, choose from 3 available templates to show your Facebook feed in: list, masonry, or carousel.

facebook feed layouts select

Once you’ve chosen your Facebook feed’s layout, you can also customize its color scheme with just a few clicks. To get started, click on the Color Scheme menu.

select color scheme option

Facebook Feed Pro lets you choose from 4 color scheme options for your Facebook feed so you can personalize the user experience of your visitors:

  • Inherit from Theme: Automatically copy the color scheme of your website
  • Light: Light background with dark-colored text
  • Dark: Dark background with light-colored text
  • Custom: Customize your feed’s background color and text color to your liking
color schemes facebook

Want even more customization? You can also choose from 3 post layouts: thumbnail, half-width, and full width. Simply click on the Posts option to get started.

facebook layout post

The thumbnail layout shows your WordPress Facebook feed with small images, like this:

how to add facebook feed to wordpress website thumbnail

Want to show your Facebook feed with images in a larger size? You can. Choose half width layout and it’ll look like this:

how to add facebook feed to wordpress website

Finally, if you want to display your Facebook feed with the largest images possible, choose the full width layout so it will look similar to this example:

how to add facebook feed to wordpress website layout

With the plugin’s live editor, you can take your time customizing your Facebook feed’s design — no coding needed.

You can also set the header type, like button, feed size, number of posts, cover photo visibility, post margins, and much more.

Remember to click the Save button once you’re done editing your Facebook feed.

Satisfied with your Facebook feed’s layout? Good!

It’s time to add it to your WordPress website by following the final step below.

Step 5: Add Your Facebook Feed to WordPress

Once you’re done with choosing and customizing your Facebook feed, the last step is embedding it on your website.

Since the plugin works perfectly with WordPress, you can easily add it to your page or sidebar-ready areas.

Don’t know which method of adding Facebook to your WordPress website you prefer?

You can check out both methods below and decide after.

Add Facebook Feed to WordPress Page or Post

First, click on the Embed button at the top right of your feed customizer.

embed your facebook feed

Next, you’ll see a popup asking you to choose between adding your Facebook feed to a page or to a widget.

To continue, you can copy the shortcode or click on the Add to a Page button here.

add facebook feed to page

Then, choose the page you want to display your Facebook feed on and click the Addbutton.

select page for facebook feed

The plugin will redirect you to the page you chose. Here, click the Plus (+) icon to add a new WordPress content block.

Type “facebook” into the search field. Then, click on the Custom Facebook Feed block to automatically add it to your page.

how to add facebook feed to wordpress website

Your Facebook feed will then appear in your page editor. Feel free to edit your page’s content as you’d like.

Finally, when you’re happy with how it looks, click on Publish to make it live on your webpage, like this:

example facebook feed

Add Facebook Feed to WordPress Sidebar

What if you want to display your Facebook feed widget to your sidebar area instead? The plugin can help you with that, too.

First, you need to choose the Facebook feed you want to embed on your sidebar.

To get started, navigate to Facebook Feed » All Feeds from your WordPress dashboard.

Then, click on the Facebook feed you want to embed.

embed facebook feed that you want

Now, you’ll see the Facebook feed’s live editor open up. At the top right, click on the Embed button.

embed button facebook

You’ll see a popup asking you where you want to embed your Facebook feed. Since we’re displaying it on the sidebar area, click on Add to a Widget.

add facebook feed as a widget

Next, you’ll be directed to your website’s very own widgets page. Here, click on Sidebar since you want to add your Facebook widget to your sidebar area.

select sidebar for widget

Then, click on the plus icon (+) to add a new Facebook feed widget to your sidebar.

choose custom facebook feed pro widget

Finally, choose the Custom Facebook Feed block. You’ve now added your Facebook feed to your sidebar area.

Now, when you visit your website and check out the sidebar area, you can see your Facebook feed displayed there, like this:

example of facebook feed sidebar

So, there you have it. Congratulations!

You now know how to easily add your Facebook feed to your WordPress website. And you didn’t even need to bother with JavaScript, CSS, HTML, or any kind of code.

Want to start embedding Facebook feeds?

Click here to get Facebook Feed Pro and start converting your website visitors to your Facebook followers.

If you also want to display feeds from other social networks, follow this guide on how to add Twitter widgets to WordPress easily.

Interested in showing other social media feeds? Then this post on how to add Instagram feed to your site can help you.

Have accounts in multiple social media platforms? Check out this post on how to embed social media feed widgets on WordPress.

author avatar
Lianne Laroya Content Marketing Manager
Lianne serves as the Content Marketing Manager at Smash Balloon, drawing upon more than 12 years of experience in WordPress content, social media marketing, user-generated content (UGC) and search engine optimization (SEO).

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.