I have a player both in Flash as well the same in HTML5 version. I am calling a page through iframe which detects the browser and device and loads the player accordingly and it is working fine.
Before the HTML5 version of the player I was able to share the Flash player to Facebook. But how do we make it workable with HTML5 player? If I share the iframe page it doesn't work nor the video doesn't play.
I find that youtube is able to do the same what we require, please advice and help how to accomplish the requirements.
Check the section corresponding to audio and video data on the open graph documentation page.
You will need to add the following open graph tags to the resource page as given in the documentation.
<html xmlns:og="http://ogp.me/ns#">
<head>
...
[REQUIRED TAGS]
<meta property="og:video" content="http://example.com/awesome.swf" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="385" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:secure_url"
content="https://secure.example.com/awesome.swf" />
<meta property="og:video" content="http://example.com/html5.mp4" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video" content="http://example.com/fallback.vid" />
<meta property="og:video:type" content="text/html" />
...
</head>
Related
I am using og:video meta tag to do sharing of video and I can play the video in Facebook newsfeed from desktop browser. However if I view the video from Facebook app, it will not not play the video and it will bring me to the article page.
You can use the Facebook Share feature from https://www.youth.sg/Spotted/People/2017/5/Captured-by-the-journey
Appreciate anyone who can help. Is there any issue with my meta tag?
<meta property="og:video" content="https://www.facebook.com/video/embed?video_id=1557722510925076" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:type" content="video.other" />
<meta property="og:image" content="https://www.youth.sg/~/media/YouthSG/behind-the-gram-yk/YK-banner.ashx?w=800&h=450&thn=1" />
<meta property="og:image:width" content="800" />
<meta property="og:image:height" content="450" />
<meta property="og:title" content="Captured by the journey" />
I'm trying to share a video via sharer url (https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fsirius.isebox.net%2Fmichal%2Ftest-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test%3Fdefault%3Dg5s3e2)
I can't get the video to play in facebook. When I debug using FB's open graph debugger, I get this strange error:
"Share has playable media but will not play inline because it would cause a mixed content warning if embedded. Add a secure_src or make the video src secure to fix this."
I have no idea where to add the secure_src to the header. Notice that og:video:secure_url is already present
Thanks
This is working now, honestly I have no idea why it wouldn't work before. Here's my bit of meta goodness that works:
<meta property="og:video:url" content="http://domain.tld/flv.flv">
<meta property="og:video:secure_url" content="https://domain.tld/flv.flv">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="300" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:url" content="http://domain.tld/mp4.mp4">
<meta property="og:video:secure_url" content="https://domain.tld/mp4.mp4">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="200" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:url" content="http://domain.tld/mp4.mp4">
<meta property="og:video:secure_url" content="https://domain.tld//mp4.mp4">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="200" />
<meta property="og:video:type" content="text/html" />
You should load the video over HTTPS protocol, the mixed content warning means that your video is loading via HTTP. You can provide your video using two url tags (secure and non-secure).
I am launching an app today, and would like to share it on Facebook. I also have a video I have made to go along with it to use as promo. Is it possible to have a video embedded in the post, that then links to the app store link? I assume this is using meta, I have tried using:
og:title,og:site_name,al:ios:app_name,og:video:url,al:ios:app_store_id
Take a look at the Open Graph specification for the correct OG tags: http://ogp.me/#type_video
There is also an example if you scroll up:
<meta property="og:video" content="http://example.com/movie.swf" />
<meta property="og:video:secure_url" content="https://secure.example.com/movie.swf" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="400" />
<meta property="og:video:height" content="300" />
I would like to embed my own HTML5 (with a flash backup) player on a Facebook wall post.
I'm using rails and ruby Koala.
I have seen this: https://developers.facebook.com/docs/share/ for meta tags that can be added, but it's either for a link to my web page or to a video file to load.
Appreciate if anyone can help me :)
http://www.longtailvideo.com/support/blog/19150/publish-your-videos-to-facebook-with-a-jw-player
Here's example of the og:tags on the link being shared so facebook can pickup the customer video player:
<meta property="og:type" content="movie" />
<meta property="og:video:height" content="260" />
<meta property="og:video:width" content="420" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:title" content="Big Buck Bunny" />
<meta property="og:description" content="Big Buck Bunny is a short animated film by the Blender Institute, part of the Blender Foundation." />
<meta property="og:image" content="http://www.example.com/bunny.png" />
<meta property="og:video" content="http://www.example.com/jwplayer/player.swf?file=http%3A%2F%2Fwww.example.com%2Fbunny.flv&autostart=true" />
Wanted scenario:
people link to my website via Facebook
open graph data pops up (name, description, thumbnail, ...) (which works)
when you click the thumbnail a youtube video plays (which doesn't work)
Facebook seems to know that there is a video to be played, but doesn't want to go through with it.
My code:
<meta property="og:image" content="<url>" />
<meta property="og:site_name" content="<name>" />
<meta property="og:description" content="<description>" />
<meta property="og:video" content="http://www.youtube.com/v/S3_AwK3ujQI&fs=1" />
<meta property="og:video:width" content="560" />
<meta property="og:video:height" content="315" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<link rel="video_src" href="http://www.youtube.com/v/S3_AwK3ujQI&fs=1" />
<meta name="video_type" content="application/x-shockwave-flash" />
<meta name="video_width" content="560" />
<meta name="video_height" content="315" />
What seems to be wrong? I read somewhere that the solution has to do something with SSL, but since I link to a external YouTube video that shouldn't be the case; or is it?
You also need an og:picture. Using https for the video url will let it play for people who have Facebook on secure. Go to a youtube page and check out what they're using for og tags.