Jump to content

How can I make a full-width background video on Avenue?

Recommended Posts

Site URL: http://puppydust.net/

Hi all. I'm a motion designer and I'm trying to update my portfolio.

On my main page you land and see there's a video for my showreel in the centre, below it thumbnails for various projects I've done. I want this video to be full-width background and for it to be autoplaying, and to keep the menu thumbnails for my projects below it.

Currently I can't see how to do this on my Avenue template. I'm willing to change the template if necessary, for instance on Nueva it seems easy to have a full width image/video, however all the content contained in the index gets expanded like a feed below, and I want to keep them as thumbnails.

Essentially the resulting effect should be like this  (this site wasn't necessarily squarespace, just a good reference)

Can anyone help?

Link to comment
  • Replies 4
  • Views 379
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

2 hours ago, kimoni said:

On my main page...there's a video for my showreel in the centre. I want this video to be full-width background and for it to be autoplaying, and to keep the menu thumbnails for my projects below it. Currently I can't see how to do this on my Avenue template.

On Squarespace these are called Background Videos. Unfortunately they aren't supported on the Avenue template. The following template families support background videos on the listed page types:

  • Adirondack - Layout, products, album, events, blog
  • Bedford - Layout, products, album, events, blog
  • Brine - Layout, album, events, blog
  • Five - Layout, album, events, blog
  • Montauk - Layout, events, blog, index
  • Pacific - Layout, products, album, events, blog
  • Tremont - Layout, products, album, events, blog
  • York - Layout, products, album, events, blog, project, index

Nueva is part of the Brine family and so does support them.

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment

Thanks for your response. What I liked about Avenue is that the index contents are displayed as thumbnails on the main page, as opposed to everything being expanded in one long page. Is there a way I can keep this thumbnail menu but on a template that supports background videos? They all seem to expand the index contents.

Link to comment
28 minutes ago, kimoni said:

What I liked about Avenue is that the index contents are displayed as thumbnails on the main page

This feature made Avenue very popular. Other 7.0 templates don't have this Avenue feature but you can build something similar by adding images to a Gallery and then linking these thumbnail tiles to the pages manually. It won't work in exactly the same way but you'll be able to have a grid of thumbnails that link to individual posts or pages.

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Would you like your customers to be able to mark their favourite products in your Squarespace store?

Link to comment

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.