How to Embed Facebook video on WordPress step by step guide

FB-video-on-WP

How to embed Facebook video on WordPress?

Do you have a WordPress website and you want to embed Facebook videos on your website?

This article will guide you step by step process to post a Facebook video on your WordPress website page or post or even you can use it on any widget section as well.
Before we start let me share the important for Facebook videos:

Importance for Facebook Videos

Video content on internet is increasing day by day and if we look for users interest from last year years you will find that most of the users prefer to watch videos apart from reading the long articles and YouTube is a most famous video content provider is a live example for this.

The number of YouTube users is too big and they are increasing day by day as well and in the similar way social media platform Facebook also have its own identification which I don’t need to explain.  Facebook got very popularity with its recent features Facebook Live and Facebook Video platform. It is very easy to embed a YouTube video on any website because YouTube gives a direct video sharing or Embed Video feature on this video settings but embedding a Facebook video is not like that simple.

That is why we see lots of request from users asking about “How to embed a Facebook video on our website?” 

You can embed Facebook videos or Facebook Live streaming video on your website and engage a more number of users on your website. It will help you to increase the number of visitors on your website.

In this article we will share a step by step guide to Embed Facebook video on your WordPress website.

Step by step guide to embed Facebook Video on WordPress

STEP1:

First you will need to find or locate a Facebook video which you want to embed on your WordPress website.

STEP2:

Now, we need the video URL. There are two ways to get  it.

  1. Right click on video and click on “Show video URL”. It will open a small pop-up window on the video and you will be able to see the video link. Just click on the video link area and copy this link. OR,
  2. Right click on “Video name or date” and select copy link address.

STEP3:

Now, we need to visit Facebook embedded video player website and you will be able to see “Embedded Video Player Configurator” area. Now you can see it’s a 3 step process:

  1. Choose URL or page: Put your Facebook video link on “URL of video” section
  2. Code Generator:  You will see a “Get Code” button. Click on this button to see the embed code.
  3. Copy and paste HTML Snippet: Now we have to copy and paste this “embed code” on our website and it will be all done.
Facebook video embed code

We will explain the above process in details below:

As you can see from the above screenshots that first of all we have to use “URL of video” section to use our FB video link and then we have to click on “Get Code” button.

Once you click on this button a Pop-up window will open and now you will have to options to embed this FB video on your WordPress website.

Using IFrame: 

Facebook embed code using IFrame
Facebook Embed Code using IFrame

This is very simple option to simply copy the code and paste in on your website and page or post as an html code. It will have two options on it.

Step1: Choose your App ID – This section will show you a dropdown to select your facebook app ID. If you don’t have any app id then you will see a link “App Dashboard”, you can use this link to create a simple app on facebook developer account.

Step2: Place this code wherever you want the plugin to appear on your page –  Copy the code from this area and paste in your website page, post or widget section as an HTML code. Facebook video will be embed on your website.

USING Javascript SKD

Facebook Embed code using Javascript SDK
Facebook Embed code using Javascript SDK

You can also use this option to embed your Facebook video on your WordPress website.

This option will give you 2 types of code which you need to use on your WordPress website. You can see it will show you 3 steps:

  1. Choose your App ID and Language: This is same as the above. Select any your any Facebook app ID or make a new app and select a language.
  2. Include the JavaScript SDK on your page once, ideally right after the opening body tag: This section will give you a code which you need to add on your website header section. Or you can say header.php file.
    1. If you have a programmer then edit your header.php file and add this code just after the <body> tag.
    1. If you are normal user install Insert Headers and Footers WP plugin. After installing this plugin you will see “Settings > Insert Headers and Footers”. Once you click on this, paste the code on the “footer” section.
  3. Place this code wherever you want the plugin to appear on your page: Now, you can see the anther code section. Copy this code and paste it on your website page/post or widget section as HTML code.
WordPress Text Editor

NOTE:  Use “Text” editor option on your WordPress pages or post to use the embed codes. In this way, they will be used as HTML code.

How to Embed  Facebook Live Videos on WordPress

Using Facebook live videos on WordPress website also works like embedding the Facebook normal videos but you can’t find the live video URL as the way you get for Normal Facebook Video.

Facebook don’t allow you to get the video link for a Live video before making it live. It means you will have to make the Video Live first and after that you can get the video link.

Once you make your Facebook Video Live, simply click on Video title or date and right click on it and click on “Copy Link Address” to get the Live Facebook Video Link.

Now you can use the Facebook embedded video player to get the embed code and paste that code on your WP website.

Final Thoughts

Normally YouTube video and Facebook Video embed process is quite similar the actual difference is YouTube provide everything on one single place and on Facebook we have to use their developer tool to create an Embed code.

Once we get the FB video embed code, we can use the code on our WP website pages/post or we can use this code on our any type of website as an HTML code snippet.

I hope this article will help you to learn, how you can add FB videos on your website.

One Reply to “How to Embed Facebook video on WordPress step by step guide”

Leave a Reply

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