# Product grid
This article guides you on how to customize and show a list of products based on a category in a grid view on your collection page.
{% hint style="success" %}
Steps
1. In the theme editor (**Customize**), open the template selector.
2. Select **Collections**, then **Default collection.**
3. On the left-sidebar, locate **Product grid**
4. Make necessary changes **> Save.**
{% endhint %}
## General and layout
Set the number of **Products per page** (8-36 products) and the **Number of columns on desktop** (1-6 products);
Provide the Product grid with an appealing and appropriate **Grid layout**:
* Standard
* Grid mix
{% tabs %}
{% tab title="Standard" %}
{% endtab %}
{% tab title="Grid mix" %}
{% endtab %}
{% endtabs %}
Moreover, you can also enable **Pagination** in 3 ways:
{% tabs %}
{% tab title="Pagination by number" %}
{% endtab %}
{% tab title="Load more button" %}
{% endtab %}
{% tab title="Infinite" %}
{% endtab %}
{% endtabs %}
## Filtering and Sorting
Allow your customers to filter collections and search results by product availability, price, color, and more.
This section allows you to **Enable filtering** for the collection. You can customize filters with the **Search & Discovery** app. [Learn more](https://help.shopify.com/manual/online-store/search-and-discovery/filters)
You can also **Enable sorting** on the collection. The collection can be sorted by:
* Featured
* Best selling
* Alphabetically, A-Z
* Alphabetically, Z-A
* Price, low to high
* Price, high to low
* Date, old to new
* Date, new to old
There are 2 types of **Desktop filter layout**s: Vertical and Drawer (Default mobile layout)
{% tabs %}
{% tab title="Vertical" %}
{% endtab %}
{% tab title="Drawer" %}
{% endtab %}
{% endtabs %}
If you want the color filter to display as color swatches instead of text swatches, simply **Enable color swatches** for the filters.
If you want the filter groups to open/expand automatically when accessing the collection page, you can insert group filter name into the **Expand filter groups** field, and each group filter is separated by a comma. Exam: Price, Color, Size
### How to customize filters
{% hint style="info" %}
Customizing the filters in your store requires the [Shopify Search & Discovery](https://apps.shopify.com/search-and-discovery) app.
The app also allows you to customize search results and product recommendations to give you more control over how customers discover your products.
Learn how to [customize filters with the app](https://help.shopify.com/en/manual/online-store/search-and-discovery/filters).
{% endhint %}
1. Go to **Online store > Navigation**
2. Click **Add** and install the [**Shopify Search & Discovery**](https://apps.shopify.com/search-and-discovery) app for your store
3. Go to **Apps** > **Search & Discovery** > **Filters** > **Edit filters**
4. Add or remove filters to show/hide from the storefront filters > **Save** the settings.
5. In the theme editor (**Customize**), open the template selector > Select **Collections** > **Default collection.**
6. On the left-sidebar, locate **Product listing** > Select **Enable filtering** checkbox
7. **Save**
## Mobile Layout
You can adjust the **Number of columns on mobile** to **1 column** or **2 columns.**
***
---
# Agent Instructions: 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:
```
GET https://docs.foxecom.com/sleek-theme/collections-and-products/collection-page/product-grid.md?ask=
```
The question should be specific, self-contained, and written in natural language.
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.