How do I display background video in HD only?

Hi there,

I have uploaded a video from my Vimeo Plus account, which I assumed would playback in HD quality. The video is a text animation, so unfortunately it looks really bad at low res.

As it is a banner video, squarespace only accepts the URL and not the embedded code of the video.

Index page - Media - Video - URL

Is there any code I can use to force playback HD always?

Website: www.oddthing.co.nzPassword: oddthingltd

Thank you!

I see you went with a GIF solution. This seems like a major flaw in the video background support from squarespace.

Vimeo defaults to "auto resolution" which seems to be the problem (especially with non-standard video sizes). Vimeo supports supports ability to specify resolution  in embedded videos but since squarespace doesn't use the embed code format for background videos, the feature is not supported. 

Raw background video iframe

<iframe id="vimeoplayer" src="//player.vimeo.com/video/376011636?api=1&background=1" class="background-video ready" style="width: 2225.09px; height: 585px; left: -334.545px; top: 0px;"></iframe>

Edited background video iframe

<iframe id="vimeoplayer" src="//player.vimeo.com/video/376011636?api=1&background=1&quality=2k" class="background-video ready" style="width: 2225.09px; height: 585px; left: -334.545px; top: 0px;"></iframe>

By manually inspecting the code of a page with a BG video and manually adding "&quality=2k" to end of src url, I am able to specify resolution and background video displays at that resolution. But aside from some super ugly custom JS I'm not sure there is a way to use this feature inside of squarespace platform.

Anyone have a better solution? 

edit: People have had occasional success in simply adding "&quality=2k" (see more resolution codes) to vimeo link URL in the page setting pop-up. 

Hello everyone,

With regard to the previous solution, I'm wondering if adding this "&quality=2k" to the end of the src url made a difference and you were able to play the background video  in HD?

Also, where did you add the "&quality=2k"? To the script on vimeo or on squarespace. Please let me know, thanks.

Having the same issue, only with video. The background banner video seems to default to a pretty low playback quality.

On 12/2/2019 at 11:24 AM, aseriousartist said:

Hello everyone,

With regard to the previous solution, I'm wondering if adding this "&quality=2k" to the end of the src url made a difference and you were able to play the background video  in HD?

Also, where did you add the "&quality=2k"? To the script on vimeo or on squarespace. Please let me know, thanks.

 

Adding it on the squarespace where you embed worked for me.