> For the complete documentation index, see [llms.txt](https://aries-theme.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aries-theme.gitbook.io/docs/collections-and-products-pages/collection-list-page.md).

# Collection list page

The Collections List page is a special page in your Shopify store that displays all of your product collections in an organized grid layout. This page serves as a central hub where customers can browse all available collections, making it easy for them to discover different product categories, brands, or themed collections. The page automatically shows all collections you've created in your Shopify admin, allowing customers to quickly navigate to the collections they're interested in. This is particularly useful for stores with multiple product categories, seasonal collections, or themed product groupings.

The Collections List page is typically accessed through your store's navigation menu or can be set as a landing page for customers exploring your store. It provides a visual overview of your entire product catalog organization, helping customers understand how your products are categorized and making it easier for them to find what they're looking for.

## Main section: Collection list page

The Collections List Page section is the main component that displays all your collections on the collections list page. This section controls how collections are displayed, sorted, and organized, allowing you to create an attractive and functional collections overview page.

<figure><img src="https://2498163780-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2LxG3rPCoA6sZo7ovFkR%2Fuploads%2FUEwRGht9OVnS9KJJIMgG%2Fimage.png?alt=media&amp;token=28f004bf-73fa-4c6a-8742-4ec8307146c7" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}

### How to set it up

1. Go to Online Store > Themes > Customize.
2. In the **page** selector, choose **Collections list.**
3. Open **Sections** > **Collections list page**.
4. Make your changes, preview live, then click **Save**.
   {% endhint %}

### Settings

#### Heading content

* **Heading**: Enter the title that appears at the top of the collections list page. The default is "Collections" but you can customize it to match your brand voice, such as "Shop by Category" or "Browse Collections".
* **Heading size**: Control the size of the page heading. Options range from h4 (smallest) to hxxl (extra large) to match your design preferences.
* **Underline**: When enabled, adds a decorative underline beneath the heading for visual emphasis.
* **Text position**: Control how the heading is aligned. Options include Left (left-aligned), Center (centered), or Right (right-aligned). This helps position the heading to match your page design.

#### Layout

* **Sort collections**: Control how collections are ordered on the page. Options include Alphabetically, A-Z (collections sorted alphabetically from A to Z), Alphabetically, Z-A (collections sorted alphabetically from Z to A), Date, new to old (newest collections first), Date, old to new (oldest collections first), Product count, high to low (collections with most products first), or Product count, low to high (collections with fewest products first). This helps you organize collections in a way that makes sense for your store.
* **Image ratio**: Control the shape of collection images. Options include Landscape (wide images), Portrait (tall images), Square (equal width and height), or Tall (extra tall images). Choose the ratio that best showcases your collection images and matches your design aesthetic.
* **Collections per page**: Control how many collections are displayed on each page before pagination. Options include 12 collections or 24 collections per page. More collections per page show more at once but may make pages load slower, while fewer collections create faster-loading pages with more navigation.
* **Columns**: Control how many collections appear side by side on desktop screens. Options include 3 columns, 4 columns, or 6 columns. More columns create a more compact layout showing more collections at once, while fewer columns make each collection more prominent and easier to see.
* **Mobile columns**: Control how many collections appear side by side on mobile devices. Options include 1 column (collections stacked vertically) or 2 columns (collections side by side). Two columns show more collections at once but make each collection smaller.
* **Full width**: When enabled, the collections grid spans the full width of the browser window instead of being contained within the page width. This gives the grid a more immersive look and shows more collections side by side.
* **Colors**: Choose a color scheme for the collections list page background. This affects the overall appearance of the page.

#### Padding

* **Padding top**: Add space above the section. Options range from 0px (no space) to 400px in 10px increments. On mobile devices, this is automatically reduced to half the value for better mobile display.
* **Padding bottom**: Add space below the section. Options range from 0px (no space) to 400px in 10px increments. On mobile devices, this is automatically reduced to half the value for better mobile display.

***

### Tips

* Use the sort collections feature to organize collections in a way that makes sense for your store. Alphabetical sorting works well for general browsing, while sorting by product count can highlight your largest or most important collections.
* Choose an image ratio that works well with your collection images. Square ratios are popular and work well for most collection images, while portrait or landscape ratios can create a more dynamic look if your images are oriented that way.
* Make sure your collection images are high quality and representative of the products in each collection. Good collection images help customers quickly understand what each collection contains.
