Publish Your Videos to Facebook with a JW Player

Please note, this is a legacy blog post, which only applies to JW Player version 5! (Note, JW5 does not support HLS)

Update:

Sharing your videos through Facebook and Twitter dramatically expands your reach across the web. Our newest HTML5 video player offers the flexibility for you to incorporate social sharing function via our API. The JW Player Sharing Overlay displays a customizable layer over the player which enables your viewers to click to share the video to social networks.

To get an overview of JW Player’s social sharing plugins and how to implement social sharing, please read this article on our support website.

Our live streaming product, JW Live, also offers a simulcast from Facebook Live, allowing all your live streams to be managed within one consolidated video CMS dashboard.

Over the past few months, you may have noticed that an increasing number of items in your Facebook News Feed had a play icon in the bottom left hand corner, like so:

This is because Facebook recently opened the News Feed to third parties, allowing individuals to watch videos from all over the Internet without ever leaving Facebook. While getting this to work requires making some minor modifications to your website, publishers have been quick to implement the changes because of the number of video views Facebook can help drive (especially when a video goes viral).

In this blog post, we’ll describe how publishers can use the JW Player with the Facebook News Feed and enable viewers to have the same experience regardless of where they’re watching it.

What You’ll Need

• A video, audio file, or any other piece of content that is playable by the JW Player
• A copy of the JW Player SWF, hosted on your web server
• A web page for your content
• This document (pretty meta, huh?)

Getting all of this to work is pretty simple, but it can be difficult to manage if you’ve got a large library of content. Additionally, Facebook does not store a copy of the content or player, so they will be loaded from your server every time they are watched on Facebook. If you’re worried about management or your ability to handle the load when your video goes viral, it’s worth taking a look at services like LongTail.tv and Bits on the Run, both of which support this type of Facebook integration natively.

Updating Your Site

Whenever someone publishes a post with a link to their News Feed, Facebook scans that page for metadata about that page. By including some specific metadata in the of your page, you can instruct Facebook to embed your JW Player with your content in the News Feed. However, this also means that you’ll need a unique web page with this metadata for each piece of content, which can become quite difficult to manage if you’re not using a CMS like WordPress or Drupal.

When scanning a page, Facebook examines the tags. Specifically, it looks at Open Graph tags – those with with an og prefix to the property attribute – and uses the data contained in the contentattribute.

An Example

  
    
    
    
    
    
    
    
    
  
  
    …
  

So what do each of these tags mean?

• og:type – The type of content described by this page, should always be “movie”.
• og:video:height / og:video:width – the height and width (in pixels) of your video player will occupy within the news feed.
• og:video:type – The type of video playback you’d like to use, should always be “application/x-shockwave-flash”.
• og:title / og:description – the title and description of your video. Note that the title attribute is different from the HTML