Add Facebook video in WordPress

In the last post, I posted about the new Facebook profile layout and I wanted to embed a Facebook video but then I knew Facebook  don’t support WordPress oEmbeds, so I thought I would just create a WordPress shortcode for embedding videos but then it must have been done already by someone else.

I did some search and found out that most bloggers are pointing out to embed videos by using the following code:

<object width="400" height="224" >
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://www.facebook.com/v/xxxxxx" />
<embed src="http://www.facebook.com/v/xxxxxx" type="application/x-shockwave-flash"
allowscriptaccess="always" allowfullscreen="true" width="400" height="224">
</embed>
</object>

Change the xxxxxx in the code to the video id and paste the whole code in a post and it will show up. You can change the width and height values as per your theme.

What if I tell you that there is an easy way that won’t let you deal with the code all the time and can even avoid the possible issues with embedding the code like in above method? I will be show you how to add a facebook video to WordPress using the power of shortcodes.

Add the following code to your functions.php file of your theme

// Facebook Video Shortcode - Ashfame.com
function ashfame_fbvideo($atts, $content = null) {
   extract(shortcode_atts(array(
      "id" => '',
   ), $atts));
   return '<object width="650" height="364" >
   <param name="allowfullscreen" value="true" />
   <param name="allowscriptaccess" value="always" />
   <param name="movie" value="http://www.facebook.com/v/'.$id.'" />
   <embed src="http://www.facebook.com/v/'.$id.'" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="650" height="364">
   </embed>
   </object>';
}
add_shortcode("fbvideo", "ashfame_fbvideo");

Just change the width and height values in this code once as per your theme and embed a facebook video in your post or page with the following syntax:

[fbvideo id="xxxxxx"]

Example:

To embed a facebook video, I will need the value of video id which can be obtained from the address bar when the video is opened in its own page.
After watching a video, click on Go to Video link.

Copy the video id from the address bar as shown in the screenshot.

And paste this in your post or page where you want to embed a video:

[fbvideo id="1598555857571"]

And it will show up as

[fbvideo id=”1598555857571″]

If you have any questions, you can ask in the comments.