I'd like to find out how Tumblr retrieves video thumbnails.
Normal video posts (not using API) when viewed from the dashboard or /tagged/ filters, some sites's video shows thumbnails, some doesn't show up.
Works for http://www.youtube.com and http://www.vimeo.com.
However, http://www.ted.com and http://www.slideshare.net thumbnails doesn't show up.
I was wondering if any of the Tumblr devs can enlighten me on the process how and where they get the thumbnail data from.
Is there a general method for retrieval that by that I can conform a document structure to?
It would also be great if the API allows you to set thumbnail url too, sort of like facebook's opengraph image meta data.
Tumblr Video Thumbnails
My understanding of {VideoThumbnailURL} is as follows:
This variable will include any related thumbnails to a video, served directly from the provider of the video.
Tumblr itself isn't generating the thumbnails. Below is the returned URL from a test, using {VideoThumbnailURL} and the video: http://www.youtube.com/watch?v=i0y4G1tNb1M
http://img.youtube.com/vi/i0y4G1tNb1M/hqdefault.jpg
To answer your question, the provider of the video would have to generate the thumbnails and Tumblr would need to support / integrate these on the Dashboard.
Easy way to test if a provider is supported, create a video post and add your embed code. If the message preview not available appears, the provider doesn't support thumbnails and / or Tumblr doesn't support this provider.
Providers with Thumbnail Support
http://blip.tv/
http://www.dailymotion.com/
http://www.metacafe.com/
http://www.youtube.com
http://www.vimeo.com
Providers without Thumbnail Support
https://vine.co
http://www.ted.com
http://www.slideshare.net
http://www.veoh.com/
http://www.twitch.tv/
Hi mikedidthis have write accurately..
As per tumbler's image thumbnail api, tumbler do not provide any inbuilt function like facebook to retrieve images like in facebook or youtube.
Please see this documentation:
http://www.tumblr.com/docs/en/custom_themes
You must use Fully SSL iframes and never display intrusive or invasive ads/popups in the video (safer to serve NO ADS/POPUPS, or you may be blocked from loading inline permanently).
You must be desktop and mobile compatible, and declare meta tags such as the thumbnail and the url to load the video using various methods (study the iframe content of those who already load inline, ex: og:video).
WHY:
Since Tumblr uses SSL in the dashboard and on many blogs, all iframes or videos must be SSL too. If you load any non-ssl content (HTTP), on a page that is using SSL (HTTPS), the content will not load, and usually just appears blank, or incomplete. This is why tumblr links in a new window, when videos aren't being pull from a URL that provides full ssl video embeds.
Using a subdomain that forces ssl, and deals with content that isn't SSL (your own pop open window), will allow your site to load inline with the Tumblr Dashboard.
If you fail to be fully compliant and Tumblr will revoke any future inline videos from your URL. That's why it would be good to load videos from a subdomain that forces ssl only, and redirects non ssl to the ssl page.
Related
Images loaded via <img> or background-image CSS URL from Contentful CMS don't show in Facebook's in-app browser e.g:
"//images.ctfassets.net/yadj1kx9rmg0/wtrHxeu3zEoEce2MokCSi/cf6f68efdcf625fdc060607df0f3baef/quwowooybuqbl6ntboz3.jpg"
...with Https hosting, and load in all other modern browsers, but not FB in app browser
I'm thinking it's a mixed content problem, but don't see how?
You just need to programatically add https: to the beginning of the image URL. It is called a protocol relative URL and it'll work with most websites by automatically taking the protocol of the page that contains it but I guess it doesn't work for Facebook
i have written a plugin for the elgg social networking platform which supports sharing links to other social networks.
mostly this is ok.
i am noticing though that facebook often shows incorrect images for the video thumbnails and other sites, such as google+ are ok.
the url i am passing in to the sharer page is correct and when i use the facebook debugging tool, i see the correct image - e.g. https://developers.facebook.com/tools/debug/og/object?q=https%3A%2F%2Fwww.infiniteeureka.com%2Fvideos%2Fwatch%2F6980%2Fwater-as-primary-healing-agent-dis-ease-is-commonly-due-to-dehydration
as an example - this is the url that the plugin currently outputs for facebook, when sharing a video on my site:
https://www.facebook.com/sharer/sharer.php?s=100&p[title]=water+as+primary+healing+agent+-+dis-ease+is+commonly+due+to+dehydration&p[summary]=description&p[url]=https://www.infiniteeureka.com/videos/watch/6980/water-as-primary-healing-agent-dis-ease-is-commonly-due-to-dehydration&p[images][0]=https%3A%2F%2Fwww.infiniteeureka.com%2Fmod%2Fvideolist%2Fthumbnail.php%3Fjoindate%3D1293022025%26guid%3D6980%26owner_guid%3D2%26size%3Dlarge
when i share this to facebook, i see a thumbnail for another video which i shared days earlier, which has a different url. (edit: i now notice that i can choose from 3 images in facebook and one of them is the correct one - so facebook is building an array of 2 incorrect images in some way and is defaulting to an incorrect one.)
anyone know?
I run into this problem often as well. Try to make your image around 1080px # 1080px and see if that helps. The other options is to try and lazy load all the other images so facebook doesn't pick them up as I presume the thumbnail you are referring to is on the page?
This is probably not possible, but I'm throwing it out here for anyone with crazy awesome ideas or if they happened to come across some morsel of information about it.
I have an embedded YouTube player (iFrame) using the API, with a custom JS control bar. All that works great.
I want to have a share option, however, since the videos on my site will often appear as overlays, it's not ideal to have the page be shared, but rather the video itself. Is there a way to have a user share the YouTube link directly from my page, rather than just a link to my site?
I already realize the fallback is to create a URL on my site that takes a video id parameter and redirects to the proper youtube page.
Doesn't the embed video from YouTube include all YouTube features by default?
(Thumbs up, share, full screen, etc…)
I want to be able to serve an iframe video player to the Facebook newsfeed & timeline.
I am aware that it is possible to specify multiple og:video:type properties for different video formats to appear within the newsfeed/timeline.
e.g. an implementation such as
Share HTML5 player on Facebook wall
As of April last year I believe we also wouldn't need whitelisting, though some kind of whitelisting may be possible for a video type of text/html which isn't generally available.
If we were just serving free video within an iframe it would be quite easy to just grab the flash and mp4 components and include them within Open Graph tags.
However our player is a little more complex, serving content based upon login status, and that level of complexity is likely to increase.
Complexity?
Built in shopping cart - Reviews - Delivery of premium content - micropayments/tipjar
We have quite a flexible oembed implementation
http://www.uqast.com/andy/video-seo?w=640&h=360&aplay=0&affid=0&links=2
Which can return quite clean embed code suitable for the timeline
http://www.uqast.com/services/oembed/?url=http%3A//www.uqast.com/andy/video-seo&w=640&h=360&aplay=0&affid=0&links=2&format=json
We can also quite happily serve the iframe from https if required.
We are also looking towards serving various kinds of HTML5 within the iframe... videos/docs/audio etc
So what procedure do you have to follow to be able to use text/html as a video type and have it whitelisted?
Note: I am the Product Manager for uqast.com
I realise this is an old question, but I noticed today (June 2014) that SoundCloud are now embedding an IFRAME HTML based player directly into the news feed.
Anyone else noticed this behaviour and how can they do it? Couldn't see anything in the OG tags about it
Thanks!
Its not currently possible to embed HTML5 content via an iframe in the Facebook News Feed. Only Flash objects or raw video files can be embedded through the og:video tag.
However, keep an eye on http://developers.facebook.com/blog for updates.
I've been in, around, and through a good chunk of the internets looking for an answer to this:
I'm trying to embed a video in Facebook using the og:video tag, but despite the fact that the facebook linter keeps showing 'status: Video embedding on Facebook enabled', when it shows up in my feed, clicking on it always opens a new window instead of showing it in the video player. It does show a little play icon, but it acts like a link rather than a video.
I've tried it with an swf url that works when i hit it, i've tried it with an mp4 video, I've tried https, http, etc. My og tags are pretty much exactly like this example I see at http://ahrengot.com/playground/circular-scrubbing/ (theres a good tutorial at http://ahrengot.com/tutorials/custom-video-player-on-facebook/).
Do I need to associate it with an app (have tried that and just using my user id in fb:admins), and if so, what kind of settings do I need to set to make it show up in a video player? Do I need to set up a canvas url?
I'm using flowplayer.
Thanks for any help.
Edit: it seemed to spontaneously start working after trying for 8 hrs. Does facebook do some kind of testing/caching of the target before it allows the embed?
yes, I'm not sure on how often..but to update facebook's cache of a specific URL, run it through the debugger (formerly URL linter) # http://developers.facebook.com/tools/debug
Might also be SSL related. If you have secure browsing enabled on FB it will launch your video in a new window. The link of the video you are embedding with og:video is using "http" and not "https".