Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Index Pages

Use Index Pages to arrange images and content from different pages in unique layouts, creating a single destination where visitors can browse content from multiple sub-pages.

Index Pages are available in certain templates.

This guide is for version 7.0. For a similar effect in version 7.1, use Portfolio Pages.

Watch a video

To see how the Index Page works, watch this video:

Index Page designs

Each template family has its own Index style that falls into one of three designs:

  • Grid - Each page in the Index creates a thumbnail image on the page. Clicking a thumbnail image opens the connected page. This design forms a visual navigation grid linking to content throughout your site. Here's an example.
  • Stacked - Each page in the Index creates a section in a single scrolling page. The sections stack vertically, allowing visitors to scroll through a lot of information, all with a unified look. Think of it as a digital version of an accordion-folded pamphlet that you can open and see all the pages at once. Here's an example.
  • Slideshow - Each page displays as a full-bleed background image with a content overlay. Clicking a page title opens the connected page. This is a great way to use images to introduce different concepts or portfolios. Here's an example.

Additionally, the Index Page's link in your navigation depends on the template. To create a drop-down menu of pages in your navigation in any template, create a folder instead. To learn more, visit Folders vs. Index Pages.

Index Page feature comparison

Here's how Indexes display in these template families. If your template isn't listed, it doesn't have an Index Page.

Template family Style Thumbnails Supported Pages
Avenue Grid Required Album, Blog, Gallery, Events, Products, Layout

Bedford

Stacked Optional Layout

Brine

Stacked Optional Gallery, Layout
Flatiron Grid Required Album, Blog, Gallery, Events, Products, Layout
Forte Slideshow Required Album, Blog, Gallery, Events, Products, Layout
Momentum Slideshow Optional Gallery

Montauk

Grid Required Album, Blog, Gallery, Events, Products, Layout

Pacific

Stacked Optional Album, Gallery, Layout
Supply Grid Required Album, Blog, Gallery, Events, Products, Layout

Tremont

Slideshow Optional Album, Blog, Gallery, Events, Products, Layout

York

Grid Optional Album, Blog, Gallery, Events, Products, Projects, Layout

To set up your Index Page, follow the rest of this guide.

Add an Index Page

If your template supports an Index Page, follow these steps:

In the Squarespace App, adding new pages is only possible in the iOS version.
  1. In the Home Menu, click Pages, then click the + icon.
  2. Select Index from the pages menu.
  3. Enter a page title, then press Enter to save. You can change this later.

Edit page settings

You can change the Index Page's settings, such as its title and URL slug. In some templates, the title, description, and thumbnail image display at the top of the page.

To edit the Index Page's settings:

  1. In the Pages panel, hover over the Index.
  2. Click the gear icon.
  3. After making changes, click Save.

2.png

To learn more about the different options, visit Page settings.

Add, edit, and arrange pages

Next, you'll build the content of the Index by adding, editing, and arranging pages. Each page creates a section of the Index.

Tip: You can add up to 100 pages to Index Pages, but we don't recommend adding more than 25. The more content you add, the longer the page will take to load.

Add pages

To add pages to an Index:

  1. In the Pages panel, click Add Page below the Index Page. Depending on your template, you may see Add SectionAdd Gallery or Page, or Add Project instead.
  2. Click any icon from the pages menu to add new pages. The menu shows the pages your template's Index supports. For example, Momentum's Index Page only supports Gallery Pages. Layout Pages are called Content sections.

Other methods

  • You can drag and drop existing pages into the Index.
  • In stacked Indexes, you can add sections using Manage Sections.
Note: Disabled pages won't display in the Index.

Build pages

You can add content to any Layout Page or collection page within an Index by clicking Edit on the page. For stacked Index Pages, click the title in the Pages panel to scroll to that section in the page preview.

  • Custom code added to pages within an Index may not render on your live site. To test your code, remove the page from its Index, then view the page directly in a private or incognito window.
  • If you don't see an edit annotation for a stacked Index, move the page out of the Index to add content, then move it back into the Index. You can also disable the page, add content to it, then re-enable it.

Reorder pages

The page order in the Pages panel reflects how they display in the Index Page. Drag and drop pages to rearrange their order.

Tip: For stacked Indexes, see additional tips.

4.png

Review password-protected pages

You can password-protect the main Index in its Page Settings.

  • In stacked Indexes, this password will also protect sub-pages.
  • In grid and slideshow Indexes, add passwords to the individual sub-pages to protect them.

To learn more, see Passwords and Index Pages.

Add pages

To add pages to an Index in the iOS version of the Squarespace app:

  1. Tap the Pages icon.
  2. Tap Add below the Index Page.
  3. Tap the page type you want to add.
  4. Click into the Page Title box and add a page title.
  5. Tap Create.

Build the pages

To edit pages within your Index Page:

  1. Tap the title of the page in the Pages tab.
  2. Tap Edit or the pencil icon beside the page title on the overlay.
  3. After adding or changing content, tap Done or the , then tap Save Changes to confirm.

Reorder the pages

The page order in the Pages panel reflects how they display on the Index Page. To reorder the pages:

  1. Tap Edit or the pencil icon in the top-right corner of the Pages tab.
  2. Tap and hold the hamburger icons to the right of the page titles, then drag the pages up or down.
  3. Tap Done.

Review password-protected pages

To password-protect an Index Page:

  1. Tap the title of the Index Page in the Pages tab.
  2. Tap the ... icon or the gear icon in the top-right corner.
  3. Tap into the Password box, then enter the password you want to use.
  4. Tap Save.

Depending on the type of Index Page, you may need to add page passwords to individual sub-pages:

  • In stacked Indexes, this password will protect sub-pages as well.
  • In grid and slideshow Indexes, add passwords to the individual sub-pages to protect them.

Add page thumbnails

You can add thumbnail images to every page or section in the Index. Depending on your template's Index style, the image may become a navigation thumbnail, a banner, or a background image.

In some templates, you can add a video thumbnail. Grid Index Pages don't support video thumbnails, so use thumbnail images instead.

To add Index Page thumbnail images:

  1. In the Pages panel, hover over the title of a page or section within your Index.
  2. Click the gear icon.
  3. Click the Media tab.
  4. Add a thumbnail image.

Repeat this process for every page within your Index.

To add Index Page thumbnail images:

  1. In the Pages tab, tap the title of a page within your Index.
  2. Tap the ... icon or the gear icon on the overlay next to the page title to open the individual page's settings. (Tip: Don't tap the ... icon in the top-right corner because it opens the entire Index Page's settings.)
  3. Under Options, tap Media.
  4. Tap Add Image to add a thumbnail image from your device.
  5. After the image uploads, tap Page Settings to go back, then tap Save.

Repeat this process for every page within your Index.

Style the Index Page

Your template determines the Index's style: grid, stacked, or slideshow. In the Site Styles panel, you'll find tweaks to help you customize how the Index looks.

Grid

You can change the number or shape of the thumbnails, their padding, and how the page titles display. Options vary by template. Use the links below for help with these template families:

Stacked

You can change fonts, navigation elements, and how page content displays. Options vary by template. Use the links below for help with these template families:

Tip: See our additional tips for managing sections.

Slideshow

You can style page names and choose how visitors click through to a connected page. Options vary by template. Use the links below for help with these template families:

Managing stacked Index sections

In Stacked Index pages, you can move, add, and delete sections using Manage Sections in the Pages panel.

To open Manage Sections:

  1. In the Home Menu, click Pages.
  2. Click the Index Page.
  3. Hover over the top of the site preview and click Manage Sections.

7.png

You'll see a zoomed-out version of your Index, which you can use to more easily scroll through sections.

  • Click and drag any section to rearrange it.
  • Use the + and - icons to add or remove sections.
  • To return to the Pages panel, click Back in the top-left corner.

Display other content

To display content from an unsupported page type within an Index, add a Layout Page to the Index. Then use the following methods to display the content on that Layout Page:

  • Blog posts - Add a Summary Block and connect it to a Blog Page.
  • Products - Add a Summary Block and connect it to a Products Page. You can also add individual products with Product Blocks.
  • Gallery images - Add a Gallery Block. You can connect it to an existing Gallery Page or add images to it directly. You can also add individual Image Blocks.
  • Events - Add Calendar Blocks and connect it to an Events Page.
  • Album tracks - Add Audio Blocks and add tracks to them directly.

You can also use Archive Blocks to create lists of blog posts, gallery images, products, and events.

Tip: Move collection pages (such as a Blog Page) to the Not Linked section so they don't show in your navigation.

Momentum

The Momentum template only supports Gallery Pages. To link to other content on your site, add a link to the description of any gallery image, or add pages to your Main Navigation so the links show in the navigation bar.

Special URLs

In the templates listed below, Gallery and Layout Page sub-page URLs include a hashtag (#) when they're opened from the Index Page. Here's an example:

http://www.mydomain.com/#/page-title

The hashtag version of the page has special formatting in these template families:

  • Avenue - Uses thumbnail navigation. Page headers and footers don't display. Gallery Page images stack vertically, with page titles and descriptions on the left.
  • Flatiron - Uses navigation thumbnails and arrows. Layout Pages display page titles and descriptions.
  • Montauk - Uses thumbnail navigation. Layout Page banners don't display; instead, they show the Index Page banner.

The version of the page with special formatting doesn't appear if there's no hashtag. This happens when:

  • A visitor goes to the sub-page's direct URL (with no hashtag).
  • The sub-page has a password.
  • The visitor opens the sub-page in a new tab or window.

Search engines don't index the hashtag version of the URL. This stops them from seeing duplicate content for your website, which is an SEO best practice. Visitors who go to sub-pages from search engine results see the version without special formatting. To prevent these pages from appearing in search, add a noindex tag to each sub-page.

Passwords and Index Pages

You can use page passwords to prevent Index content from being publicly visible.

Password-protect any main Index Page in its Page Settings.

How you password-protect sub-pages depends on the Index style:

  • For grid and slideshow Indexes, add a password directly to each sub-page.
  • For stacked Indexes, the main Index Page's password protects the sub-pages.

For password-protected sub-pages in grid and slideshow Indexes:

  • The sub-page's thumbnail displays normally in the main Index Page.
  • When a visitor clicks that thumbnail, or goes to the direct URL, they'll be prompted to enter the page password.
  • Special formatting won't display for the Avenue, Flatiron, or Montauk families.

For password-protected stacked Indexes:

  • If a visitor goes to the direct URL for a sub-page, they'll be prompted to enter the page password for the main Index Page.
  • In the Pages panel, the password field is hidden for sub-pages. Drag the page out of the Index to set a password. After you've added a password to a page, you can't drag it into an Index.
Note: In the past, you could add passwords to sub-pages in a stacked Index. If your sub-page already has a password:
  • The page's thumbnail image and content appears in the Index.
  • The login prompt won't appear unless the visitor goes to the direct page URL.
  • If you delete the password, the password field will disappear.
  • If you drag the page out of the Index, you won't be able to drag it back in until you remove the password.

SEO and social sharing 

Because Indexes are collections of pages, search engines and social media sites interact with them differently than other pages in Squarespace. To learn more, visit Index Page SEO and social sharing.

Replicate an Index in other templates

If your template doesn't support an Index Page or the Index Page style you like, there are ways to recreate the look of an Index on any template:

Was this article helpful?
97 out of 221 found this helpful