Downloading videos from one site and uploading it on another site without permission is illegal. This is why most video sharing websites offer embed codes for the videos hosted on their site.
Most of the popular video sharing sites on the internet allow their videos to be embedded on other sites using a piece of code. YouTube, Vimeo and Dailymotion have been offering this feature for a while and very recently Facebook has introduced this feature too.
So if you come across an interesting video on Facebook which you would like to share through your blog, you can simply use the embed code for the respective video and paste it in your post. The embedded videos will work perfectly on both desktop and mobile devices.
However this feature has a few limitations too. While you can embed a private video on your blog, but your audience won’t be able to play it. So you should just resort to embedding video which are available for the public on Facebook.
Here’s how you can embed Facebook videos on your blog or website.
How to Embed Facebook Videos on your Blog or Website
- Step 1: Play any video on Facebook and click on Option that appears at the bottom right of the video.
- Step 2: Select Embed video.
- Step 3: A popup would appear with the embed code highlighted. Copy the embed code and paste it in a post on your blog.
Unfortunately, the embed code doesn’t work on WordPress sites as as WordPress will convert all & chars to #038; in the code and and break the player. So instead of using the embed code provided by Facebook, you can use the following code.
How to Embed Facebook Videos on a WordPress Site
Copy the below code and replace the red text with the URL of the Facebook video and paste it on your WordPress blog post. Additionally you can even manually set the width of the video by editing the data-width value which is highlighted in green color in the below snippet of code.
<script>window.fbAsyncInit = function() {
FB.init({
xfbml : true,
version : ‘v2.3’
});
}; (function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_US/sdk.js”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
<div class=”fb-video” data-href=” Replace this text with the Video URL ” data-width=”500” data-allowfullscreen=”true”></div>
Here’s how the video should appear on your WordPress site.
