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

The Index Page in Supply creates a visual navigation with a grid of thumbnail images linking to pages within your site. An Index Page makes a great homepage.

Supply Index Pages can display the following page types:

  • Album Pages
  • Blog Pages
  • Events Pages
  • Gallery Pages
  • Regular Pages

To learn how to organize content in your Index, visit Using the Index Page. To learn how to set it as your homepage, visit Setting a homepage.

Tips: Create an Index Page in the Pages Panel and add pages to it with the + icon. Each page must have a page thumbnail to display in the Index.

Background color

Index Pages have separate background colors from the rest of the site. To set the background color, open an Index Page in the Pages panel, and then navigate to the Style Editor. The Index Background Color tweak in the Products section adjusts the background color.

Page titles and hover options

Use the Index List Title Style tweak in the Index section of the Style Editor to adjust when the page titles display.

  • Overlay - Image dims and title displays on hover.
  • Color Overlay - Title displays over a color filter on hover.
  • Under - Title displays below the image. Image dims on hover.
  • Always Show - Title displays over a color filter. Image brightens slightly on hover.

For Color Overlay or Always Show, use the Image Item Color to set the filter’s color and transparency.

Use the Index Title Color and Index List Font Size tweaks to adjust the page titles. Index Column Width and Index Gutter adjust the size and spacing of the thumbnail images.

Thumbnail shape

The Index Aspect Ratio tweak controls the shape of your thumbnails. Selecting any Aspect Ratio other than Auto will make all the images the same shape.

Sidebar navigation

Use the Index Links tweak in the Navigation section of the Style Editor to control how the Index and its pages display in the sidebar navigation.

  • Show Both - Display the Index Page title as a link and its pages as sublinks.
  • Parent Link Only - Display only the Index Page title as a link.
  • Child Links Only - Display only the pages within the Index as links.
  • Show Both While Inside Index - Display the Index Page title as a link on all pages. While on the Index Page or a page within the Index item, the categories display as sublinks.

Mobile

The thumbnail links for Index Pages stack vertically on mobile. The page background color shows as a border around each product item or thumbnail image.

If the Index List Title Style in the Index section of the Style Editor is set to  Under, page titles display below each thumbnail image. If set to OverlayColor Overlay, or Always Show, titles display centered within each thumbnail.

m-index-supply.png

Note: For general information about styling your site, visit Structure and style.

Next step

Showcase your videos and images with a stacked Gallery Page.

Was this article helpful?
1 out of 7 found this helpful
Supply Index Pages