Jump to content

Video/Image banner loading slow - is there a fix?

Recommended Posts

Hi guys, on my site grow-wild.co, I have a home page banner video linked via YouTube - it takes anything from 3-7 seconds to load. I uploaded a fallback image (a still from the video) to display in the hope that it would load very quickly and make the user experience better. But the image takes a minimum of 3 seconds to load and in the mean time the user sees a black background. This obviously isn't ideal! 

I have spoken to SS support and they can't offer me a work around - there is no way to change the black background colour without overlaying a colour ontop of the video/image. 

The image size is just 150kb. 

Does anyone have any suggestions? Have you found a work around for this? 

Thanks! 

Link to comment
  • Replies 6
  • Views 7.4k
  • Created
  • Last Reply

This plugin should help - https://www.squarewebsites.org/products/background-videos-utils

I used it on a client site recently and it works perfectly. 

NB. I didn't write this plugin and I am not affiliated with the author. 

 

I'm Colin Irwin aka silvabokis.  I've been a Squarespace designer & developer since 2013. 
I remember when it was all wild prairies round these here parts. 🐃🤠
Advice I give on here is free, though I may sometimes post an affiliate link or promote something I've written.
That reminds me.. ..you might want to check out my
Squarespace template finder or have a look at my other Squarespace tips
Speaking of tips, 💲I've got a tip jar that you're welcome to throw a few quid into if you think I've helped you. 
If you're looking for a Squarespace developer 
Book a chat or Drop me a line - first meeting is always free  

 

Link to comment
  • 3 weeks later...
On 10/8/2019 at 10:00 AM, SheriM said:

Hi guys, on my site grow-wild.co, I have a home page banner video linked via YouTube - it takes anything from 3-7 seconds to load. I uploaded a fallback image (a still from the video) to display in the hope that it would load very quickly and make the user experience better. But the image takes a minimum of 3 seconds to load and in the mean time the user sees a black background. This obviously isn't ideal! 

I have spoken to SS support and they can't offer me a work around - there is no way to change the black background colour without overlaying a colour ontop of the video/image. 

The image size is just 150kb. 

Does anyone have any suggestions? Have you found a work around for this? 

Thanks! 

Hi there, did you find a solution for this? thanks!

Link to comment

I'm having this question too. Kind of. The cover page video is apparently too slow loading on some desktop versions - and pulls the mobile image.  But on my phone (iPhone 6S) it sometimes display the video ... I assumed it would pull the mobile fallback image here (but that might depend on connection speed?).

Link to comment
  • 2 months later...
On 10/8/2019 at 7:17 AM, colin.irwin said:

This plugin should help - https://www.squarewebsites.org/products/background-videos-utils

I used it on a client site recently and it works perfectly. 

NB. I didn't write this plugin and I am not affiliated with the author. 

 

I'm having this issue with my video homage banner. It takes 4 seconds on first load with a black screen.

Colin, do you have an example of the plugin working on a website?

The plugin website mentions this "...It uses built-in Squarespace code to load videos, so the functionality may vary with Squarespace changes."

Wondering if you have any example to share before taking a chance and throwing away $35 if it's not going to work.

Also looking at pre-loading pages but so far no luck. If anyone has recommendations on pre-loader plugins etc would be great. I'm using the Bedford template.

 

Link to comment
  • 2 months later...
  • 3 months later...

Archived

This topic is now archived and is closed to further replies.


×
×
  • 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.