How Squarespace Index Pages work

You know when you're scrolling through a website and there’s a series of sections with their own background down a page. It's a very popular feature lately. You’d think that would involve some hefty code, and a developer to get that look, right? If you're using Squarespace, it's not necessary at all.

Squarespace Index Pages allow you to create a single page from multiple pages of content. Each Index Page format is one of stacked, grid or slideshow. Index Pages allow the website builder to add, remove and move sections as and when they like, within or outside the Index.


The format referred to above is the Stacked layout. Each page in the Index creates a section, one above the other, of a single scrolling page. It is a flowing stream of separate pages, so each one can have a different background banner image or video. It's sort of like a poster, with a block behind each section to separate them. Of course, these sections don't have to have a colour or image behind them, but that does help to separate them. These pages allow your users to browse through different information, separating the blocks as they read. A good example of this in action is the Brine template preview homepage.


Avenue template - Grid Index

Avenue template - Grid Index

The next type of Index Page is Grid. Each page in the Index shows as a thumbnail image on the page, and when you click a thumbnail image, the corresponding page is opened.  This design forms a visual navigation grid linking to content throughout your site. An example of this in use is the Avenue template homepage


The final type of Index Page layout is the Slideshow. Each page displays as a full-bleed background image, with content overlaid in front. Clicking a page title opens the connected page. This Index layout is a great way to use imagery to introduce different concepts or portfolios, or to showcase a venue, or event space. An example of this in action is the Tremont template homepage, where Eat, Drink and Visit are different pages.


Selected template families offer Index Pages, and each has its own limitations, so if this is something you’re set on, make sure it’s included before you start working with a template, and you're happy to work with the layout that template allows for.



Take a look at our self-paced online course