Tuesday, August 14, 2012

Easy Way to Add Facebook Videos to Your Websites

1. Go to Facebook Video Page

When you are viewing a Facebook video in your news feed / profile and reach the end, these are the options offered.

2. Find Facebook Video Url

Now look at the long url address in the browser location bar. It will look something like this

http://www.facebook.com/video/video.php?v=123456789012345

This is the url of the Facebook video page and cannot be embedded. We have to edit / shorten this url to get the actual Facebook video url to embed. So this is the shorter url we need (note the changes, number stays same)

http://www.facebook.com/v/123456789012345

2. Get Facebook Video Embed Code

If you look at the old style embed code for any Youtube video, you find it looks like this

<object width="500" height="314">
<param name="movie" value="http://www.youtube.com/v/kdjuyfQijs0?fs=1&amp;hl=en_US"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/kdjuyfQijs0?fs=1&amp;hl=en_US" type="application/x-shockwave-flash" width="500" height="314" allowscriptaccess="always" allowfullscreen="true"></embed>
</object>

This is a standard embed code for shockwave flash video. We have highlighted the embedded youtube urls. Now replace those youtube urls with the Facebook urls.

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

Paste in html mode in your post, and your Facebook video is embedded! Enjoy!

No comments:

Post a Comment