Hack To Embed Facebook Videos Into Your Ning Network

Post date: Oct 5, 2011 6:00:17 PM

How to Embed Facebook Videos into Ning Networks

Originally posted this to the Creators network for Ning, but you never can tell these days where your data will go, so I'm posting it over here for those who need this help.

As we all know, ning has made It quite simple to embed Youtube videos, but how (you might ask yourself) can you embed Facebook videos on your ning network. Facebook videos have links to share the Facebook video on your wall or to your friends wall, but does not provide an embed code. Well, today I'm going to show you how to hack a facebook video url and embed facebook videos into your ning network using either the video embed option or the inline video embed feature within a text box. Here is how to do it.

*additional hack to shortcut much of this at bottom of this post (for slow internet connections)

1. Find a Facebook Video which is relevant to your ning...go to its page.

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

Click on the “Go to Video” link and you are directed to the Facebook video page.

2. Find and Edit 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 (not a real video)

This is what the url of the Facebook video page looks like and cannot be embedded. We have to edit and 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. Make the 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. I 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!

You can see a live example working on my land surveyors network here:

It even retains the cook facebook overlay...remember to copy the title and description of the video from the facebook page to paste in the fields on your ning.

Enjoy!

now for the additional hack...

some people just do not watch videos all the way through....so here's how you get the url without having to watch the video:...if you are looking at a facebook video inline (on your wall feed), simplyright click on the textlinked title of the video and copy URL. paste it into a text file, delete all the unnecesssary characters in that url as explained above...paste that URL into the embed code you're making and get the same result...

now for the obvious....

IMPORTANT NOTE: All Facebook videos are NOT in the public domain. Videos posted by Facebook users maybe copyrighted, personal, private, and may NOT be permitted for distribution or illegal to use without permission. So before you go ahead and embed any Facebook video, ALWAYS seek permission from the video owner / creator.