Hey. I need a simple way to add a custom thumbnail over the Vimeo player, so I can upload any image as the thumbnail – the is simple, for example, on Squarespace [example attached]. I’m learning my way through Webflow now, can’t find a way. Cheers
I’m sorry you’ll have to look into Vimeo’s information to change the video thumbnail. Other than that, you can use the Lightbox link to launch a video Lightbox and set the link to whatever image you want. You will have to make the play icon though.
Webflow isn’t really as plug and play as Squarespace so you’ll have to create a lot of elements yourself but the flexibility to do whatever you want far surpasses Squarespace.
I am still looking for an answer to this. any updates please?
Having learnt a lot more on Webflow since I posted this, I can say I think Dave’s solution is nice.
The thing which maybe isn’t super clear is that you can pick whichever thumbnails frame or upload a custom image but you have to do that in the video’s settings on Vimeo.com before it will show on Webflow.
Another I came up with myself is; position a div over your video, design a play button to sit in it and then give the div a background image. Setup an interaction animation to make the div transparent on mouse over.
Thanks a lot Max.
This was really helpfu.
I think the 2nd option is more likely. I need to do embed other people videos from viemo as well so I won’t have access to vimeo account. They are filmamkers who will send me high res still and I think having the play button with that Div is more likely to make it work.
It seems like a simple topic and weirdly enough Squarespace had a very simple answer to it, but I didn’t find this anywehre else!
You’re welcome! I’m glad it helps.
I was looking more. For a solution more like what you get on Squarespace.
If you look the solution mattvaru gives here you can make something really nice; a fake ‘cover’ with play button, same as I suggested, but you can make it so it starts the video playing when clicked… eliminating the extra click my first idea forces the used to make.