> For the complete documentation index, see [llms.txt](https://uxsmart.gitbook.io/velare/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://uxsmart.gitbook.io/velare/customize-your-pages/collection-page.md).

# Collection page

The collection page is where customers browse a category of your store and decide which product to open. It sets the first impression of a category with a banner, then lists the products in a grid with the filters and sorting customers use to narrow the choice. Vélare builds it from one template, **Default collection**, so a change here applies to every collection using that template.

Most visits to a product page start here, which makes this the page that decides how much of your catalogue a shopper ever sees.

<figure><img src="/files/c2H5EwtPKRzZHKMht0zF" alt=""><figcaption></figcaption></figure>

### Where to find it <a href="#where-to-find-it" id="where-to-find-it"></a>

{% hint style="success" %}
**Steps:**

1. Go to **Online Store > Themes > Customize**.
2. Open the template selector at the top of the editor.
3. Select **Collections**, then **Default collection**.
4. Click a section in the left sidebar to edit it, or click **Add section** to add a new one.
   {% endhint %}

*Result:* the preview loads a sample collection and the sections that build the page appear in the left sidebar.

### What is in this section <a href="#what-is-in-this-section" id="what-is-in-this-section"></a>

| Page                                                                                                          | What it covers                                                                                                                    | Read it when                                                          |
| ------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
| [Page template sections](/velare/customize-your-pages/collection-page/page-template-sections.md)              | Which sections are built for the collection template, and which global sections you can add on top.                               | You want the map before you start editing.                            |
| [Collection banner](/velare/customize-your-pages/collection-page/page-template-sections/collection-banner.md) | The image, title, description, and breadcrumb at the top of the page.                                                             | You want each category to feel like a destination rather than a list. |
| [Product grid](/velare/customize-your-pages/collection-page/page-template-sections/product-grid.md)           | The listing itself: how many products per row, pagination, filters, sorting, and the promotion blocks you can drop into the grid. | Always. This is where customers choose.                               |

### Suggested reading order <a href="#suggested-reading-order" id="suggested-reading-order"></a>

1. Start with [Product grid](/velare/customize-your-pages/collection-page/page-template-sections/product-grid.md). Filters, sorting, and the number of products per page do more for sales than anything above the grid.
2. Then set up [Collection banner](/velare/customize-your-pages/collection-page/page-template-sections/collection-banner.md), so the header matches the density of the grid underneath.
3. Finish with the global sections listed in [Page template sections](/velare/customize-your-pages/collection-page/page-template-sections.md) if you want story content under the listing.

### Related pages <a href="#related-pages" id="related-pages"></a>

* [Product page](/velare/customize-your-pages/product-page.md): where customers go after clicking a product here
* [Collection list page](/velare/customize-your-pages/collection-list-page.md): the page that lists your collections rather than the products inside one
* [Product cards](/velare/customize-your-pages/product-cards.md): the shared rules for every product shown in the grid
* [Badges](/velare/customize-your-pages/badges.md): the sale, new, and sold out labels customers see while browsing
* [Custom product badge](/velare/buy-and-install/create-required-metafields/metafields/custom-product-badge.md): your own badge text on a single product in the grid


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://uxsmart.gitbook.io/velare/customize-your-pages/collection-page.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.