Sharing Video on Facebook

There are several ways you can post Ooyala-based videos to Facebook timelines.

Ooyala-based videos can be posted to Facebook in the following ways:
  • Through the Player share button with active or passive sharing.
  • Through sharing from the host web page for the video with active or passive sharing.
Note: Facebook does not allow autoplay of videos by third party players inside the Facebook feed. Therefore, autoplay settings will be ignored when the player is embedded on Facebook.
Note: Sharing from the host web page is not Ooyala-specific. For more information on how to share a video from a web page to Facebook, go to Facebook's documentation about Sharing on the Web.

The following section describes how to get started with the Ooyala Facebook Code Example (available at zip download). It contains examples of how to embed the share button and how to create a Facebook application that displays your videos on your viewers’ timelines.

The Ooyala Facebook Sample code sample provides two types of Facebook sharing: active sharing and passive sharing.
Type of Sharing Description Facebook App Required?
Active Active sharing posts the video to the viewer's Facebook timeline when the viewer clicks a Share button you program. This is the most common, normal kind of sharing on Facebook and has the equivalent effect as enabling sharing for Facebook in Ooyala player branding options (as described at Configuring the End Screen for Flash Player V3 (Deprecated)). No. Can be done simply with embedded meta tags in a web page.
Passive Passive sharing automatically posts video viewing information to your viewers’ timelines, without requiring them to click Share. Yes. You can use the embedded meta tags in your web page or app.

Common HTML HEAD and META tags

Both active and passive sharing rely on Open Graph (OG) head and meta tags that you must embed in your web page or app. These tags are shown below:
  • The first line is a modification of the HTML head tag. This is required in your page for either active or passive sharing.

  • The first meta tag, shown in bold, is required for passive sharing, because you must have a Facebook app for passive sharing, as detailed in Passive App Setup.

  • Highlighted in italics are values that you must supply to this template.

  • docUrl appended to og:video causes analytics events for the video to be grouped under the URL specified rather than the URL the player is placed on.

  • The values for the query parameters need to be url encoded.

  • While sharing videos using the open graph tags , the player associated with the asset in Backlot is embedded in Facebook, regardless of the player used in your webpage. To change the associated player for an asset, see Managing Video Details.

  • The query parameter autoplay=1 appended to og:video causes the video to autoplay on Facebook sharing.
  • The query parameter autoplay=1 appended to og:video causes the Ooyala Player to start video playback as soon as it loads after the user clicks the preview image in the wall post. Without the parameter, the user needs to click again to play the video after the player loads (resulting in two clicks to play one video).
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# video: http://ogp.me/ns/video#">
<!-- The following tag is required for passive sharing -->
<meta property="fb:app_id" content="yourFacebookAppIdHere" />
<meta property="og:type" content="video.other" /> 
<meta property="og:title" content="yourTitleHere" />
<meta property="og:description" content="yourDescriptionHere" />
<meta property="og:url" content="yourURLwithTheEmbeddedVideo">
<meta property="og:image" content="yourImageUrlHere"/>
<meta property="og:video" content="yourUrlHere?embedCode=YourOoyalaEmbedCodeHere&keepEmbedCode=true&docUrl=http%3A%2F%2Fexample.com" />
<meta property="og:video:secure_url” content="yourSecureUrlHere?embedCode=YourOoyalaEmbedCodeHere&keepEmbedCode=true" />
<meta property="og:video:type" content="application/x-shockwave-flash" />

<meta property="og:video:height" content="480" />
<meta property="og:video:width" content="640" />	     
        
Examples of these tags with real values are in the other sections.

해당 내용이 도움 되었습니까?