<div style="background: url('{{'https://i.vimeocdn.com/video/57666341.jpg'}}')">
</div>
I've tries examples using https://i.vimeocdn.com/video/VIMEOID.jpg
but the image showing at https://i.vimeocdn.com/video/57666341.jpg is a completely unrelated image to the video at https://vimeo.com/57666341 for example although they have the ID/
A Vimeo video at https://vimeo.com/76979871 doesn't necessarily have a thumbnail URL located at https://i.vimeocdn.com/video/76979871.jpg.
To get a video's thumbnail links, try using oEmbed with the video URL:
GET https://vimeo.com/api/oembed.json?url=https://vimeo.com/76979871
The thumbnail_url should be in the response, note that it does not share the "video_id":
https://i.vimeocdn.com/video/452001751_1280x720.png
Related
I have a website with a video from Vimeo embedded as:
<iframe src="//player.vimeo.com/video/496371201" frameborder="0"></iframe>
Google says that it cannot index the video because I don't provide a thumbnail. Google's documentation for video best practices states:
Provide a high-quality thumbnail
To be eligible to appear in Google video features, a video must have a valid thumbnail image. Otherwise, the page may be indexed but would only appear as a plain blue link.
You can allow Google to generate a thumbnail, or provide one in one of the supported ways:
If you're using the HTML tag, specify the poster attribute.
In a video sitemap, specify the video:thumbnail_loc tag.
In structured data, specify the thumbnailUrl property.
If you allow Google to fetch your video content files, Google can generate a thumbnail for you.
Supported thumbnail formats: BMP, GIF, JPEG, PNG, WebP, and SVG.
I have the thumbnails as PNG files. What is the HTML code to include them as thumbnails near to the iframe embedded video from Vimeo so that Googlebot finds it?
In regards to thumbnails for vimeo, you can retrieve the thumbnails links from the vimeo API(https://developer.vimeo.com/api/reference/videos/3.4.7#get_video_thumbnail) or oEmbed(https://developer.vimeo.com/api/oembed/videos). Not sure as far as google requirements, separate item.
I have a website with the embed youtube video list and the several videos loads as a list inside a iframe. I used ytchannelembed to generate this section(code).
My issue is individual video link is not going to the Youtube channel instead it is going to ytchannelembed page and play the video inside that page. How to make it goes to Youtube page and play the video.
Appreciate your help.
I would like to know how can I add an image in html when you load a vimeo video ?
Any informartion, links related or codes are welcome.
Thank you!!!
I guess you are talking about how to add a poster-like utility for Viemo videos, as done trough the poster HTML attribute when placing HTML5 videos.
Well, there's no such an option, as far as I know. When Vimeo is not active (as it has not been played yet) the video's thumbnail image is displayed, and when Vimeo's video is loading, it shows it's own loading animation.
Anyway, you can select your custom image when uploading your video on Vimeo, so, at least, by this way you can define what will be showing by default your custom player.
I made a webpage with a video that runs as a fullscreen background-image, at:
http://79.170.44.219/grotto.com/JupiterBrewing/landingPage.html
If I use the html with the url code in this block:
<div class="screen" id="screen-1" data-video="http://ia600803.us.archive.org/4/items/BirdsAndFeederroyaltyFreeStockVideo/BirdsAndFeeder.mp4">
it works.
If I use the url below for my edited video, which I uploaded, it does not run: https://vimeo.com/129360280, I also uploaded my edited video to youtube and tried to use it as my url.
How do I access the url for a vevo video thumbnail? youtube makes it easy by hosting predicatably located images, and vimeo requires that you go through their api. But what about vevo? For example, give the following embed code:
How do I access a corresponding thumbnail?