Beginner's Guide for WordPress / Start your WordPress Blog in minutes

How to Embed a Facebook Video in WordPress

Do you want to embed a Facebook video in WordPress?

In the early days, you could use a simple snippet of code to embed Facebook videos on your site. But with recent changes introduced by Facebook, this method is no longer supported.

Now, you need to meet certain criteria and have an access token to be able to embed videos.

Thankfully, there’s an easy way to skip the complications and embed Facebook videos in just a few clicks. In this article, we will show you how to embed a Facebook video in WordPress.

How to embed a Facebook video in WordPress

Why Add Facebook Videos in WordPress?

Did you know that over 4 billion videos are viewed on Facebook by over 100 million viewers every day?

Facebook videos are no doubt one of the most powerful tools for businesses to engage with users, market their product or service, and build their brand.

Having said that, statistics show videos on websites tend to keep visitors engaged for longer.

So embedding Facebook videos on your WordPress site makes for good business sense. It can help grow both platforms simultaneously.

The videos can help increase traffic and engagement on your website. At the same time, you can get more views, likes, and shares for your Facebook page.

Embedding Facebook Videos in WordPress

The easiest way to embed a Facebook video in WordPress is by using the Custom Facebook Feed Pro plugin by Smash Balloon.

Custom Facebook Feed Pro is the best social media feeds plugin that’s easy to set up and use.

First, install and activate the Custom Facebook Feed Pro plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Note: There’s a free version available as well that lets you embed Facebook videos. We’re showing the pro version because it has more features.

Upon installation, on your WordPress dashboard, you need to visit the Facebook Feed » Settings page.

Here, open the ‘License’ tab to enter your license key. You can find the license key information under your account on Smash Balloon’s website.

License settings in Smash Balloon

Once you’ve activated your license, save your changes and you can begin to use the plugin.

Next, you need to connect to your Facebook account from where you would like to embed videos on your site.

To do this, switch to the Configuration tab and here, you’ll see a big blue button that says ‘Connect a Facebook account’.

Connect Facebook account

When you click on this button, you’ll get an option to select either a Facebook page or group. We’ll show you how to connect both these options.

Continue connecting Facebook Feed Pro to Facebook

Connect Your Facebook Page to WordPress

Upon selecting ‘Facebook page’ in the previous step, a login page will open up. You’ll need to enter your credentials and log into your Facebook account.

After this, a list of all your Facebook pages will be displayed. Simply choose the page you wish to connect to your site.

Select your Facebook page

Next, Smash Balloon will display a list of permissions it requires in order to function properly. We recommend that you leave these permissions as it is.

Once you’ve granted the required permissions, you’ll be redirected back to your WordPress site.

Now, a popup window will open with a list of pages you have authorized. Here, you can select the page you wish to connect to and then click on the ‘Connect this page’ button.

Connect Smash Balloon to Facebook Page

Upon doing so, Smash Balloon will automatically fetch your Facebook ID and your Facebook Access Token for you.

Now, make sure you save your settings in order to store this information with the plugin.

Connect Your Facebook Group to WordPress

If you chose to connect a ‘Facebook group’ to your WordPress website, first, you’ll need to log into your Facebook account by entering your credentials.

Once you’ve logged in, Smash Balloon will request permission to read the content of your page or group.

Grant Smash Balloon Facebook permission

By clicking on the ‘Choose what you allow’ link, you can change the permission you want to grant for each group.

After you’ve granted permission to Smash Balloon, the plugin will bring you back to your WordPress site.

Now, a popup window will open with a list of groups you have authorized. Here, you can select the group you wish to connect to and then click on the ‘Use token for this Group’ button.

Select the group that you want to use on your website

Upon doing so, Smash Balloon will automatically fetch the Facebook ID and Access Token for the group.

Now the plugin will display a message that says you need to add the Smash Balloon app to your Facebook group settings. Simply click on the ‘here’ link in the popup message and then go to the apps section on that page.

Click the Done button on the popup to continue setting up your Facebook group feed

Here, you can search for ‘Smash Balloon’ and you’ll see the app appear. You just need to click on the app to add it to your Facebook group settings.

Lastly, don’t forget to save your settings to store these changes.

Now, your website is successfully connected to your Facebook page or group.

Customizing Embedded Facebook Videos in WordPress

Smash Balloon lets you customize the video display to suit your preferences and your website’s theme.

By default, Smash Balloon displays all content from your Facebook page or group such as statuses, events, photos, videos, and more.

If you want to display only videos from your Facebook page or group, visit Facebook Feed » Customize page.

On this page, scroll down to Post Types and uncheck all the boxes except the Videos box.

Customize Facebook video feed

Now, the default settings allow videos to play in a lightbox popup. This means when a user clicks on a video, a popup video player appears while the rest of your website’s content is dimmed.

This enables the user to focus only on the video they are watching. However, if you wish to disable this feature, on the same page, you can scroll down to the ‘Lightbox’ option.

Disable lightbox Smash Balloon

Now, check the ‘Disable’ box here to turn off lightbox popup mode. Once you’re happy with your customizations here, you can save your changes at the bottom of the page.

After this, Smash Balloon lets you choose to display your videos in three different layouts.

To select the layout, go to the ‘Post Layout’ tab and you will see options to display your Facebook video as a thumbnail, half-width, or full-width video on your site.

Setting your posts to be half width in the Facebook feed from your group

You can choose the one that’s best for your site.

Next, you can decide what details you want to display along with the video such as the description, date, likes, shares, and comments.

Simply scroll down on the same page, you will see ‘Show/Hide’ settings. You can select the details you want to display by checking the boxes next to them.

Show or hide details in Smash Balloon Facebook video

If your plan is to display only a video without any details, simply uncheck all the boxes here and the details will be hidden.

Once you’ve finished customizing your Facebook video feed, click on the ‘Save Changes’ button to store your customizations.

Now that the Facebook video feed is customized and ready, we’ll show you how to embed it on your site.

Displaying Facebook Videos in WordPress

Smash Balloon’s Custom Facebook Feed plugin lets you display a Facebook video feed on your site.

This means it will create a video gallery that displays all your Facebook videos in a beautiful layout. The plugin will also automatically fetch new content from your Facebook page or group and add it to the gallery.

This saves time and makes it easier to showcase your Facebook videos on your site.

Having said that, the plugin also lets you display a single Facebook video as well as a Facebook Live stream using an extension.

First, we’ll show you the steps for all three options.

How to Display a Facebook Video Feed in WordPress

Smash Balloon’s Custom Facebook Feed is the best video gallery plugin on the market.

Using the plugin, we’ll show you how to display a Facebook video gallery in a WordPress page, post, and sidebar in under a few minutes.

Display a Facebook Video Feed in WordPress Pages and Posts

Displaying a Facebook video feed in a page or post requires the same steps. For our example, we’ll show you how to display it on a WordPress page.

On your WordPress dashboard, visit Pages » Add New to create a new page. Next, you can add a new block by clicking on the (+) icon.

Add Facebook video feed in block editor

Next, search for ‘Facebook’ and you’ll see the Custom Facebook Feed icon appear in the results. Simply add this as a block and you’ll see a preview of the video feed in the editing panel on the right.

In case you’re using the Classic editor, you’ll need to paste the shortcode [custom-facebook-feed] in your page or post.

Adding the Custom Facebook Feed shortcode in the classic WordPress editor

Now, all that’s left to do is Save or Publish your page and preview it to see your Facebook video feed displayed on your site.

Display a Facebook Video Feed in a WordPress Sidebar

Smash Balloon makes it super easy to display a Facebook video feed in a sidebar.

First, you’ll need to open the Appearance » Widgets page. Here, under Available Widgets, find the Text widget and then drag and drop it into your sidebar.

Adding a custom Facebook feed to a widget

Now, open the Text widget and paste the shortcode [custom-facebook-feed] inside the editor.

After this, visit any page or post that has a sidebar enabled and you’ll see the Facebook video feed has been embedded.

How to Display a Single Facebook Video in WordPress

There are times when you may want to display a video related to your content on a page or post, or maybe even a sidebar.

To do this, you’ll need to install and activate the Smash Balloon Featured Post extension. Installing an extension is just like installing a plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Once activated, the extension creates the following shortcode that you can use to embed the video.

[custom-facebook-feed type=video featuredpost=8245623462_10152583755573463]

To use the shortcode, first, you need to replace the numbers here with your page ID and video post ID.

If you don’t know the page ID or video ID, you can find them in your video post URL on Facebook. The first string of numbers is your page ID and the second string of numbers is your video post ID.

Facebook video URL

After you’ve replaced the numbers, copy the shortcode, and keep it ready to paste.

Now, you can head over to your WordPress site to embed the Facebook video using this shortcode.

Displaying a Facebook Video in Posts and Pages

The steps to display your Facebook video in a page or post are simple. For our example, we’ll show you how to embed it on a page.

First, go to Pages » Add New to create a new page. Now, in the page editor, you need to add a new block by clicking on the (+) sign.

Next, simply search for the ‘Custom Facebook Feed’ widget and add it as a block on your page.

Add single Facebook video using Smash Balloon

Once that’s done, select the block and you’ll see that the block settings open on the right-hand side.

Now you can paste the shortcode you copied earlier in the ‘Shortcode Settings’ field.

After this, you can Save or Publish the page or post, and then Preview it to see your Facebook video live in action on your site.

Displaying a Facebook Video in a Sidebar

If you would like to display a Facebook video in a sidebar, first, you’ll need to open the Appearance » Widgets page.

Here, under Available Widgets, scroll down to find the Text widget and add it to your sidebar.

Custom Facebook Feed in sidebar widget

After that, in your sidebar on the right column, open the Text widget and paste the shortcode you copied earlier inside the editor.

Next, visit any page on your site that has a sidebar to see the Facebook video live in action.

How to Display a Facebook Live Video in WordPress

By displaying Facebook Live videos on your WordPress site, you can improve your engagement and get more views and followers too.

Before you can display a live video, you’ll need two things,

  1. A Facebook Live URL
  2. Smash Balloon’s Featured Post extension

First, to get a Facebook Live URL, you’ll need to schedule a live video. To do this, head over to your Facebook account and select Live Video in the ‘What’s on your mind?’ status bar.

Whats on your mind status bar in Facebook

Now, visit the ‘Schedule a Live Video’ tab to select a date and time for your live session. Once you’ve done that, schedule the live video to create the post.

Schedule a Facebook Live video

Next, switch to the ‘Upcoming Live Videos and Events’ tab and you’ll see a preview of your live post. Here, you need to click on the three dots to get an option to copy the Facebook Live video URL.

Get Facebook Live post url

Once you have the URL, paste it into any plain text editor on your computer. You’ll see a string of numbers at the end of the URL which is your video post ID. Copy this post ID as you’ll need it in the next step.

Next, you’ll need to install and activate the Smash Balloon Featured Post extension. For more details, see our step by step guide on how to install a WordPress plugin.

The Featured Post extension provides you with this shortcode that you can use to embed the live stream on your site,

[custom-facebook-feed type=video featuredpost=8245623462_10152583755573463]

In this shortcode, there are two sets of numbers which are your ‘page ID_video post ID’.

Simply replace these numbers with your own Facebook page ID and the post ID from the Facebook Live URL you copied earlier.

Once you have the shortcode ready, head over to your WordPress admin panel to embed the live stream.

We’ll show you how to display the Facebook Live video in a page, post, and sidebar to get the best exposure.

Displaying a Facebook Live Video in Posts and Pages

A great place to display a live stream would be on your home page. You can also choose to display it inside specific pages and posts.

The first step you need to take is to edit the page or post you wish to embed the live video in.

Now, in the post edit page, simply add a new block by clicking on the (+) sign and add the Custom Facebook Feed block to your page.

Add single Facebook video using Smash Balloon

After this, when you select the block, you’ll see block settings appear on the right-hand side.

Now you can paste the shortcode [custom-facebook-feed type=video featuredpost=8245623462_10152583755573463] in the ‘Shortcode Settings’ field.

Don’t forget to replace the numbers with your pageID_livevideopostID.

Once done, you can Save or Publish the page or post, and then Preview it to see your Facebook video embedded on your site.

Displaying a Facebook Live Video in a Sidebar

Displaying live videos in your sidebar is easier than ever with the Custom Facebook Feeds Pro plugin.

First, you’ll need to visit the Appearance » Widgets page. You’ll see ‘Available Widgets’ on the left of the page. Here, you can select the Text widget and add it to your sidebar.

Custom Facebook Feed in sidebar widget

After that, in the sidebar menu, you need to click on the Text widget to open an editor. Now, paste the shortcode you created earlier [custom-facebook-feed type=video featuredpost=8245623462_10152583755573463] inside this editor.

Make sure you replace the numbers with your own Facebook pageID_livevideopostID.

After that’s done, you can visit any page on your site that has a sidebar to see the Facebook Live video post has been embedded.

Now, visitors will be able to watch the video once you go live on Facebook.

Like this, the Smash Balloon plugin’s shortcode comes with a whole range of parameters that you can use to customize your video feed. For more details, see the complete list of parameters on their website.

Combining Feeds to Create a Social Wall

Do you want to do more with your social media content on WordPress?

Then try out Smash Balloon’s Social Wall that lets you combine social media posts from different platforms and showcase them on your website.

Smash Balloon Social Wall

Your website visitors will be able to engage with your presence on Instagram, Facebook, Twitter, and YouTube.

This helps maximize exposure, improve engagement, and gain more followers across all social platforms.

We hope this article showed you how to embed a Facebook video in WordPress.

You may want to check out our pick of best email marketing services and best keyword research tools to grow your website traffic.

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.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit – a collection of WordPress related products and resources that every professional should have!

Reader Interactions

40 CommentsLeave a Reply

  1. Is there a way to embed a past facebook live video? i would like to add some of my past lives from my facebook business page to my website but i keep getting error message that says “Video Unavailable this video may no longer exist, or you don’t have permission to view it”. Is there a workaround this?

    • You should be able to follow this guide for embedding Facebook live videos. You may want to check the settings for your video to ensure you don’t have any restrictions there.

      Admin

  2. Hm .. how about to put on website a code that refreshes every xy seconds and if there is a live stream show it?
    You wrote how to embeed already saved LIVE video on FB to website. But if you are out on a concert and want to stream to your page, you cannot do this procedure every time … go live, grab a link, generate code, put it on website … you know what I mean?
    Thank you

  3. This was extremely helpful. I used the header footer plugin, embeded the code in the footer, then embeded the video code into the post and all worked a treat. Now we can easily add facebook videos to blog posts. Thanks

  4. I have a website and when I embed a facebook video or a plugin for facebook comments, it all comes up in Dutch. I am based in Ireland although my servers are in the Netherlands. How can I correct this problem without having to move servers

  5. Hey, is there a way to have videos play in HD on mobile? Would love to host our videos via our facebook page, but they just look like junk when playing on mobile.

  6. Does this allow for an option to have visitors share the video back to Facebook and their friends? Or is there another plugin or something for that?

  7. This is useful, but the section to add the code is now entitled “Embedded Video Player Configurator”

    I pressed CTRL+F and pasted “Code Generator” into the search box and it brings the cursor to a different section that says “Besides the Code Generator, you can also embed the code manually.”

    “Code Generator” is only written once on the page.

    Thought I would share this in case anybody else gets confused ;)

    Ok, wish me luck please, I haven’t edited the header.php file before (I’ll let you know how I get on!)

    Thanks

  8. Thank you for this easy to follow and working tuts. This is where I get all the info I need about anything WordPress. Keep up the good work

  9. I followed these instructions and it didn’t work. I inserted the code into the text, not the visual. All that shows up is the text I copied from the second window. I also double checked the text I inserted using the “Insert Headers and Footers” plug-in.

  10. On my mac I do not find an “insert footings and headings” option under “settings.” Where else to look for it?

  11. I used this way and the plugin to insert 3 videos from my fb page to my wordpress site, but I can play only one of them, for the two of them I cannot click play on the video.
    I used the code for the footer only once and on my page I used the second part 3 times with the different code shown in facebook developers.
    Am I doing something wrong here?

  12. I guess no one is responding to these questions.

    I didn’t get 2 pieces of code, only one : (

  13. One more question- how do I center the video without breaking the code? I tried but looks like it somehow turned itself into a blockquote.

    Great tutorial thanks!

  14. Thank you for this tutorial – I followed it exactly, and it works perfectly!!! Thank you!
    Now, I have a question, how do I center it? I have added , , however, when I publish the page, wordpress is removing the center commands. Any advice?

  15. Hey,

    Is there any plans to give Facebook videos the same support as Youtube and Vimeo videos on WP? Eg. simply posting the video ink in the post editor and having the full responsive video show in the front-end..

  16. Thank you so much for this super clear tutorial!! I researched several ones and they all left me confused but yours is so well done! I was able to embed my facebook video successfully and I’m good to go! You rock Chris!

  17. This didn’t work for me and I followed all the steps. I’m confused. Some help would be nice. After following all the steps I placed the second set of code in a blog post and when I update it, it just shows the code.

    Thanks

  18. Thank you so much for this tutorial. It really helped a lot and it worked for me! Happy NEW Year!

  19. Sadly, if you have SEO plugins like Yoast, the Facebook Comments plugin is not compatible. So I ended up using Disqus.

  20. “You can add this code in your WordPress posts, pages, or even a widget area.”
    It would be nice to expand on that .I practice how do you do that?
    thanks

  21. Hi,

    This does not work if I want a video from my facebook page ? It says video invalid in code generator.my page is
    Thanks for all the videos . They are good help for beginners

Leave a Reply to Mihai Kato 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.