Jump to content

Force Background Video to Playback at Full Resolution? (Custom CSS)

Recommended Posts

Posted (edited)

Site URL: http://ryanmariehelfant.com/

Is there Custom CSS code to force my background video to playback at full resolution from the second it appears?

Can it fully load at max resolution before it starts playing? 

No matter the file size, resolution, codec, and FPS, it automatically buffers at low resolution for EXACTLY 6 SECONDS before snapping into full resolution.

(I have tried video ranging from 5MB to 1GB, 480p to 1080p, H.264 and Apple Pro Res, 24FPS and 25FPS - none of this makes a difference! It seems that there is something embedded in Squarespace that causes an exact 5 second low resolution buffer period).

 

 

 

@bangank36 ?

Edited by ryanmariehelfant
  • 1 month later...
  • 2 weeks later...
Posted

Desperately following this topic. Client is hosting on YouTube. Was thinking of using a pro Vimeo account, but it appears the issue persists regardless of source url. 

I'd rather have the thumbnail exist for a second or two, and let the video play smoothly at 2K when it's ready. 

  • 1 month later...
Posted

I am having the exact same issue.

I am quickly losing faith in SquareSpace.  There support gave me some mumbo jumbo about custom code messing it up.  However what I have is only cosmetic.  

Wordpress is looking better and better each day.

  • 2 weeks later...
Posted

Was there any follow up on this from Squarespace? I just discovered I'm having the same problem, regardless of video background, regardless of codec, regardless of YT upload resolution or export resolution, it hit's full buffer in the same point in the video (likely that 6 second spot op described). Can anyone explain what's going on here or how we can avoid this? There has to be some sort of navigation around this to pre-buffer 1080p, or lock it at 720p so you don't get those jarring resolution switches.

 

Thanks in advance.

  • 2 weeks later...
Posted

Any progress on this? I've been waiting for Squarespace or anyone to come up with a workaround or a fix for about 2 years. It really makes no sense for this to STILL be broken after all this time.😒

  • 4 months later...
Posted

This is really rather bad as the muddy first seconds kinda completely destroy the first impression that a video on a cover page is supposed to create. 

Squarespace needs to fix this either by downloading / hosting the video or letting it buffer a bit longer ...

  • 4 months later...
Posted

Same here, this is really crucial for me as motiondesigner.
Don't want to switch back to selfhosting like Wordpress just because of that issue.

www.vinzent.me

  • 1 year later...
Posted

Having the same issue. Spoke to squarespace said that they were aware and trying to fix. However seems like they don't really care as this issue has been going on for years it seems. Thinking of jumping ship but wish I didnt have to rebuild my site on another platform. But I see so many sites that full quality video plays instantly on. This really shouldn't be a problem for such a leading site building service.

  • 2 weeks later...
Posted

If you would try my https://www.squarewebsites.org/squarespace-plugins/background-videos-utils and enable  my simple iframes - it will respect the quality settings (you may set in backgrounds itself, use values accordingly, its ?quality=1080p for Vimeo, Youtube stopped support from query and uses adaptive stream now it seems, you were able to do ?vq=hd1080 before). SS realisation will ignore this, but plugin will try to use. 

  • 3 months later...
Posted
On 1/31/2023 at 3:10 AM, michaeleparkour said:

If you would try my https://www.squarewebsites.org/squarespace-plugins/background-videos-utils and enable  my simple iframes - it will respect the quality settings (you may set in backgrounds itself, use values accordingly, its ?quality=1080p for Vimeo, Youtube stopped support from query and uses adaptive stream now it seems, you were able to do ?vq=hd1080 before). SS realisation will ignore this, but plugin will try to use. 

This is THE BEST SOLUTION to this freaking problem. Thank you. I just dropped the code in the cover page section and set the appropriate values and the background videos load straight to HD. Thank YOU! I was about to switch to WIX, saved a ton of work.

  • 8 months later...
Posted
On 1/31/2023 at 12:10 AM, michaeleparkour said:

If you would try my https://www.squarewebsites.org/squarespace-plugins/background-videos-utils and enable  my simple iframes - it will respect the quality settings (you may set in backgrounds itself, use values accordingly, its ?quality=1080p for Vimeo, Youtube stopped support from query and uses adaptive stream now it seems, you were able to do ?vq=hd1080 before). SS realisation will ignore this, but plugin will try to use. 

Purchased this plugin but still have the same 6 second low-res buffer. Is there a walkthrough anyone can share to get this to work? Crazy that Squarespace STILL has not solved this issue after all these years. 

Posted
3 hours ago, mfalkenthal said:

Purchased this plugin but still have the same 6 second low-res buffer. Is there a walkthrough anyone can share to get this to work? Crazy that Squarespace STILL has not solved this issue after all these years. 

So just were needed to read commented lines in settings and set values. Who purchased plugin - will get a help.

  • 2 months later...
Posted (edited)
On 5/4/2023 at 11:36 AM, Drevangough said:

This is THE BEST SOLUTION to this freaking problem. Thank you. I just dropped the code in the cover page section and set the appropriate values and the background videos load straight to HD. Thank YOU! I was about to switch to WIX, saved a ton of work.

Plugin works but does nothing regarding buffer issue. Avoid buying. 

Edited by reeceo
Posted
On 4/12/2024 at 12:11 AM, reeceo said:

Plugin works but does nothing regarding buffer issue. Avoid buying. 

Have you contacted me? If you use Vimeo and set quality param + use buildCustomVideos ?

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.