Jump to content

Project looping video thumbnails 7.1

Go to solution Solved by tuanphan,

Recommended Posts

Site URL: https://jasonyuan.design/

I am building a new portfolio website using the Cami template on 7.1

On the homepage, I will have a grid of projects that link through to project pages – there are many ways to do this with different blocks, however, I want the project thumbnail link to be a looping, autoplaying video with with no controls whatsoever.

GIFs are too heavy, and when I recreate the project thumbnail using a video block, you cannot make it click through to the project, and despite using Vimeo pro for hosting, pause controls still appear on hover. (Screenshot attached)

Is there anyway to do this like this example? – https://jasonyuan.design/

Play controls.png

Link to comment
  • Replies 7
  • Views 1.9k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

  • Solution

Hi,

I think you can use Code Block to add video.

To make Code Block video clickable, we will add some a tag into Code Block

To make video autoplay + no control, we can use Video Element by @WillMyers

If you feel this ideal fine, let me know. I will try create a demo & test

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
13 hours ago, adamw90 said:

@tuanphan Perfect, Will's video plugin is very helpful thank you!

I've got the video loop working nearly as I want, just need to add the code for the clickthrough link and I'll be done

 

Thanks

Can you share link to page where you added Code BlocK? I will try testing some a tag link

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...
On 3/5/2022 at 7:57 AM, Fulleren said:

Hey @adamw90 were you able to get a click through code working? I'm having the same issue - I got my videos to autoplay/loop/no controls but I'd like for the block to link to link to a project on a different page.

Any insight would be super helpful!

Can you share link to page where you use video? We can help easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 5 months later...
  • 9 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.