Lauren Taylar

View Original

A Guide to Squarespace Index Pages

As a Squarespace website designer, I’m always on the hunt for ways to make my clients’ websites unique, responsive, and easy-to-navigate – and that makes index pages one of my FAVORITE features of Squarespace 7.0.

(There are many more favorites, though, which you can check out here…In case you hadn’t noticed, I LIVE and BREATHE Squarespace and know how powerful it can be for solopreneurs).

Not sure what the difference is between Squarespace 7.0 and 7.1? You can find out here.

Index pages are a staple of Squarespace 7.0 because they allow you to display content from multiple pages on one page, providing a unique design and more customization.

In other words, index pages help you display different colored backgrounds on your website.

Here’s an example:

As you can see, this index page allows for an organized, clean look while still displaying a variety of content in one place.

*A note about Squarespace 7.1*

It is not possible to create a Squarespace index page in Squarespace 7.1, but you can still access index pages in a few 7.0 templates.

In 2020 with the new Squarespace 7.1 update, you can now easily add different colored backgrounds on a regular page. No need for index pages! 

Today, I’m outlining all the Squarespace index page must-knows so you can confidently incorporate them into your website and reap their many benefits like a pro.

Let’s dive in!

What is an index page and how does it differ from a regular page?

Index pages allow images or colored backgrounds to be stacked on one another in a grid-like format to link to content from a variety of different pages on your website on one page.

This allows you to organize content from your website in a way that is not only aesthetically pleasing, but user-friendly – allowing visitors to your site to have a clear and organized launch point from which they can explore various parts of your website.  

I personally LOVE using index pages on my own website and those of my clients in my work as a Squarespace website designer because they are such a unique way to place content from all over your website (such as blog posts, service pages, etc…) on one, easy-to-navigate page.

I have found that this makes for an easy user experience (which is SO important on a business website!

If your website is hard to navigate, people aren’t going to find your services.)

In addition, visitors can easily get a feel for your content by exploring an index page, which usually provides a great overview of your site as a whole and gives them clues as to whether your business is something they are interested in exploring.

Do all Squarespace 7.0 templates allow index pages?

Unfortunately, the answer is no.

Only a few Squarespace 7.0 templates allow index pages to be created, and these few include the Brine family templates.

Pssttt...my favorite to use is the Rally template, which you can learn more about here!

For this reason, you have to be careful when choosing a template if you’re set on utilizing index pages.

You can find out which templates offer index pages by exploring this template comparison chart provided by Squarespace.

Personally, I think it’s worth it to choose a template which allows for index pages because they can help your website stand out not only in its looks, but in its ease of navigation.

In addition, they allow your audience to see an overview of a variety of your content in one place before veering off into specific niches of your site, where other important information about your business could be lost.

How do I use index pages in Squarespace?

If you’re sold on the idea of organizing your content on a Squarespace index page, your next question is probably how to make it happen.

Luckily, it’s not too difficult to create and organize index pages on Squarespace thanks to Squarespace’s simple format and ease of use – but this tutorial should help you out, too!

Directions:

  • Under the not linked section, click the + icon

  • Choose index page from the popup options

  • Rename the index page

  • Click “+ Add Section” to add a subpage

    • You can choose either a blank page, some pre-made page layouts, or a gallery

  • Click the gear icon next to the subpage to change its name and URL

    • Tip: change the subpage name to something that represents the content on the page - 2-3 words is fine

    • If you want to remove a page from being seen live on your website, you can uncheck “enable page”

You can edit each index page as you normally would for any page by clicking “edit” in each section of the page.



Squarespace HACK: How to Put an Index Page in a Folder

This is a great hack that I love to use on clients’ websites as an extra layer of organization and sophistication.

And, great news!

It’s not as difficult or involved as it may seem.

You can easily put a Squarespace index page in a folder on your website by following the steps laid out below:

  • In the top navigation, add a folder

  • Click “+ add page” and choose link from the popup options

  • Add the link title and next to the link box, click the gear icon

  • Go to page and type in the page you want to add

  • Click apply and save

How to Rearrange Index Pages

Once you’ve created and started using your index pages, you may decide that the subpages need to be rearranged.

You may not like the look, you may want to add content, or you may want to reorder content to make your page flow better.

Fear not! You can easily switch up the layout of your index pages by following these steps:

  • Use the drop down arrow to open up the index page

  • Click and drag the sub pages in a different order

How to Adjust the Height of Index Pages

You may find that you want to adjust the height of your index pages in order to create a different look for your content grids.

Great news – doing so is entirely possible, and I do often on clients’ websites depending on their preferences!

I’ve laid out the steps to doing so here (and, hint, it’s simpler than you think using a banner image!):

Index pages are a fantastic tool to use on your website (or to ask your Squarespace website designer about if you are working with an expert to design your site with the 7.0 version!)

I hope this information on Squarespace index pages helps you take your website to the next level.

If these tips helped you, there are so many more to be explored here on my blog, where I detail website case studies, my favorite tips for Squarespace, and more information on finding a great Squarespace website designer.


Looking for a Squarespace or Showit website designer to bring your dreamy vision to life? I’m passionate about helping high level coaches and creatives build bomb ass websites that connect with dream clients.

Looking for more Squarespace tips? Check out these blog posts: