How to Embed a Facebook Video in WordPress

How to Embed a Facebook Video in WordPress

by Stacey Corrin on July 7, 2020

Looking for an easy way to show video content in WordPress? Featuring videos from social media platforms like Facebook is a great way to connect with your audience right on your website. Even better, it encourages visitors to follow your business page.

In this article, we’ll show you how to embed a Facebook video in WordPress to get more likes and grow your business.

Here’s a table of contents outlining the main steps to embed a Facebook video in WordPress:

  1. Install the Custom Facebook Feed plugin
  2. Connect your Facebook account
  3. Select the video post type
  4. Choose your video feed layout
  5. Style your Facebook video posts
  6. Embed your Facebook videos in WordPress

Why Add Facebook Videos to WordPress?

As we mentioned, highlighting Facebook videos on your website is ideal for engaging with your readers. Videos are more interactive than copy. And since they’re highly visual, users will remember them long after they’ve left your website.

Facebook videos, in particular, can benefit your site in several ways:

  • Helps website users discover your Facebook business page, building a link between both platforms
  • Lets you display more diverse content on your site such as Facebook Live videos
  • Helps increase user engagement on Facebook content which can boost its visibility in the news feed
  • Can increase likes and engagement on your Facebook page, helping to grow your social community

Even better, if you want your site visitors to have a more immersive social experience, you can display Facebook events on your website as well as feeds of other relevant Facebook content.

Methods for Adding Facebook Videos to WordPress

There are a few ways to embed a Facebook video in WordPress, such as manually with an embed code or WordPress plugin.

Let’s look at each method in more detail.

Manually embedding Facebook videos requires you to find the video’s embed code. Then you have to manually paste the code wherever you want to display the video on your website. While this might seem easy, it involves several steps and navigating between different websites to get things working.

This method also doesn’t leave you with much room to customize your videos and the type of information included.

Embedding Facebook videos with a WordPress plugin is as simple as installing it and clicking a few settings. You won’t need to navigate between different sites, and it won’t require any copying and pasting of code.

WordPress plugins also give you complete control over the information included in your videos and their design. This is a massive advantage if you don’t know how to code because customizing your videos to look amazing is as simple as clicking the option you want.

For this tutorial, we’ll begin by showing you how to embed a Facebook video in WordPress the easy way, with a WordPress plugin.

Custom Facebook Feed Pro Plugin

Our plugin of choice is Custom Facebook Feed by Smash Balloon, the most popular Facebook Feed plugin for WordPress.

Besides giving you the ability to embed any Facebook video in your WordPress site, Custom Facebook Feed lets you create beautifully simple, yet deeply customizable Facebook feeds.

This means you can show any type of Facebook content on your site, including:

  • Events
  • Photos
  • Videos
  • Live videos
  • Statuses
  • Albums
  • Links
  • Facebook reviews
  • Group posts

Then you can display them in interactive feeds for visitors to engage with directly on your website. What’s more, those same visitors can click and share your content and like your page without leaving your site.

Not tech-savvy? Don’t worry! You can get your feeds looking exactly how you want without having to touch a single line of code. Even better, if you get stuck, the Smash Balloon support team will help you every step of the way.

facebook Feed plugin review

Click here to get started with the Custom Facebook Feeds plugin.

Embedding Facebook Videos in WordPress The Easy Way

Step 1: Install the Custom Facebook Feed Plugin

The first step to embed a Facebook video in WordPress is to install the Custom Facebook Feed Plugin and activate it on your website.

If you need some help, you can learn how to install a WordPress plugin in this step-by-step guide.

Step 2: Connect Your Facebook Account

Once you’ve activated the plugin, hover your mouse over the Facebook Feeds link in your WordPress admin panel, and click Settings. This takes you to the plugin’s settings page where you can link your Facebook account.

To connect Facebook to your website, click the blue Connect a Facebook account button. Then follow the instructions to link your page or Facebook group.

Connect a Facebook account

Once your page is linked to the plugin, scroll down to the Settings heading. Here you can choose to show posts from the page owner, other people, or a combination of both. You can also choose how many posts to display and set your time and date preferences.

Facebook feed plugin settings

When you’re happy with your settings, click Save Changes.

Step 3: Select the Video Post Type

To show only videos in your Facebook feed, navigate to Facebook Feeds » Customize. This page lets you select the type of content to display, your feed’s header type, and which buttons to show.

Scroll to the Post Types section and untick all the options, leaving the Videos type checked. This will ensure only Facebook video posts show in your feed.

Select the video post type option

Under the video post type, you can configure the following settings:

  • Video Source: Show videos from your Facebook timeline or videos page
  • Show Video Name: Show or hide the name of videos in your feed
  • Show Description: Show or hide the description of your videos
  • Number of columns: Select how many columns of videos your feed should have
  • Display Playlist: Click “how to display a video playlist” to reveal instructions on how to edit your feeds’ shortcode to display specific video playlists from Facebook. We’ll go into more detail on this later.

After, scroll further down the page to the Header section. Here you can show or hide your Facebook header in your feed. There are 2 different header layouts, including Text and Visual.

Facebook header options

The text header shows a simple title and icon layout similar to the example below.

Facebook text header layout

The visual header layout gives you the ability to include your Facebook cover photo, name and avatar, bio, and likes.

Facebook visual header with cover photo

There are similar options to include a Facebook Like Box widget at the top or bottom of your feed. The widget includes more information about your page and allows users to Like your page directly from your website.

Facebook like box widget

You can also choose to display a Load More Button to reveal more videos in your feed with a single click.

Remember to click the Save Changes button when you’re happy with your settings. Then let’s move on to choosing a layout for your Facebook videos.

Step 4: Choose Your Video Feed Layout

To choose your Facebook video feed layout, scroll up to the top of the Customize page and click the Post Layout tab. At the top of the Posts Layout page, you’ll see 3 different layout settings including, Thumbnail, Half-width, and Full-width.

Choose your Facebook post layout

Click the radio button beside each layout to choose the one you want. For this tutorial, we’re choosing the Full-width layout.

After is the Show/Hide section. This is where you can hide specific information from displaying in your video feed. For example, you might want to create a minimal look by choosing to hide video descriptions and post text. You can also hide the avatar and name of each posts’ author for a more unified appearance.

Show or hide specific facebook post information

When you’re happy with your settings, click Save Changes.

Step 5: Style Your Facebook Video Posts

To choose a style for your Facebook video posts, click the Style Posts tab at the top of the page.

The plugin offers 2 different post styles including a regular feed with a line separator or you can show a feed of posts in individual boxes.

facebook post styles

Further down the page are options to customize the post text, description, date, and more. Just remember to click Save Changes before navigating to a different page.

Step 6: Embed Your Facebook Videos in WordPress

With your feed customized and styled to your liking, it’s time to add it to your website.

There are 2 different ways to embed a Facebook video in WordPress using the Facebook Feeds plugin:

  1. Facebook Feed WordPress Block: Lets you embed your Facebook feed in a post or page using the new WordPress block editor.
  2. Facebook Feed Shortcode: Allows you to embed your Facebook videos in the classic WordPress editor, in your WordPress theme, or sidebar widget.

Don’t worry if you’re not sure which option to choose. We’ll show you how to embed your feed with both options.

How to Embed Facebook Videos in the WordPress Block Editor

To add your Facebook feed to a new page using the WordPress block editor, navigate to Pages » Add New. Then inside the editor, click the Plus (+) icon to add a new WordPress block.

Add a new WordPress block

In the search box, type “Facebook” and click the Facebook Feed WordPress block to add it to your page. The plugin will automatically display a preview of your video feed to make changes before you publish.

Facebook feed WordPress block

Clicking the block in your editor reveals the block settings on the right-hand side of your screen. Here you can customize the feed to display your Facebook video playlist that we mentioned earlier.

First, you’ll need to find your playlist ID, a string of numbers in the video URL. Then enter the following shortcode into the shortcode settings box:

custom-facebook-feed type=videos playlist="133856444099"

Just be sure to replace our video playlist ID with yours before clicking Apply Changes.

WordPress block shortcode settings

When you’re happy with your feed, click the Publish button. When you preview your page, you’ll see how your Facebook Video feed looks live on your website.

Embed a facebook video in WordPress

How to Embed Facebook Videos in the Classic WordPress Editor

If you’re still using the classic WordPress editor, you can use the Facebook Feed shortcode to embed your videos.

Simply follow the instructions above to create a new page and paste the Facebook Feed shortcode directly into the page editor. For a full list of shortcode options, see the documentation here.

Embed a Facebook video in the classic WordPress editor

You can also use this option to show your Facebook video feed in your website’s widget area. To do that, navigate to Appearance » Widgets.

Then find the Text WordPress widget and drag it to your sidebar area. Inside the widget, paste your shortcode, and click Save.

Embed a facebook video in the WordPress sidebar widget area

When you preview your website, you’ll see a Feed of Facebook videos embedded in your site’s sidebar.

Embed a facebook video in your WordPress sidebar

Embedding Facebook Videos in WordPress Manually

As mentioned earlier in this article, it’s possible to embed a Facebook video in WordPress manually. However, this method doesn’t allow you to customize your video layout and settings in the ways you can with a plugin.

What’s more, it involves copying and pasting code snippets that can seem scary if you don’t have much technical experience. And if you want to customize the text, colors, and information included in the video, you’ll need to hire a developer to get things looking right.

So if you’re not comfortable with manually embedding Facebook videos, it’s much easier to use the plugin method above.

Otherwise, you can follow these instructions to embed a Facebook video manually in WordPress.

First, you need to find the video you want to embed on Facebook and copy the video URL to your clipboard.

Copy the Facebook video URL

Then click this link to open up the Facebook plugin documentation and paste the URL into the URL field. Underneath, you’ll see a preview of the video.

Facebook embedded video player configurator

Click the Get Code button to generate the code needed to embed the video on your website.

A popup opens with 2 different types of code to add to your website. The first part of the code needs to go in your website’s header section.

Facebook video player embed codes

You can do this by editing the header.php of your theme. Alternatively, some WordPress themes include an option in the live customizer to add code directly into your theme’s header, like in the example below.

Add the code to your WordPress theme header

When you’ve done that, copy the second part of the code and paste it into the post or page where you’d like to embed your Facebook video.

Add the embed code to the custom html block

In the WordPress block editor, add the Custom HTML block and paste the code. When you preview your page, you’ll see the Facebook video player with your chosen video manually added to your website.

Facebook video manually embedded in WordPress

If you’re using the classic editor, paste the code directly into the WordPress Editor. Just make sure you choose the Text editor rather than the Visual editor.

Manually embed facebook videos in the classic WordPress editor

Then click Publish and Preview to see your video.

That’s it!

We hope this article helped you learn how to embed a Facebook video in WordPress. With Smash Balloon’s Facebook Feed plugin, you can show any type of Facebook content in WordPress with no technical knowledge required. Then you can engage your visitors, increase your business page likes, and grow your business.

What are you waiting for?

Click here to get started with the Custom Facebook Feeds plugin.

And if you enjoyed this article, feel free to follow us on Twitter and Facebook for more helpful tutorials.

Want to Try our Facebook plugin for Free?

Enter the URL of Your WordPress website to install Custom Facebook Feed Lite.

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.

Leave a Reply

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