# Product grid

Feature products from collections with this rich modern product grid section:

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

Supports siblings swatches, animated product image slideshow, and Quick Add.

### Quick Add

The Quick Add drawer allows customers to view all the product images and easily choose the correct variant option:

<figure><img src="/files/9U0ozfXA4sEaacYBKN1b" alt=""><figcaption></figcaption></figure>

Section settings include heading title, collection, products per row for desktop and mobile, section background color, a show all button, and section padding.&#x20;

{% hint style="success" %}
Pipeline can show both a Quick Add and Quick View option.&#x20;

* If you have more than one variant option and the swatches option isn't enabled for the "color" variant option, the Quick View feature is shown.
* When the number of variant options is more than 15, or the combined length of the variant options is more than 90 characters, it will show the Quick View feature.
  {% endhint %}

### Section only

The Product grid section only uses section settings to configure. This design is a quick and simple section to feature one collection. For the block version with additional options and to also display multiple collections in one, see the Collection product grid section:

{% content-ref url="/pages/IzCBBjMIADN7wYac45OS" %}
[Collection product grid](/sections/list-of-sections/collection-product-grid.md)
{% endcontent-ref %}


---

# 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://pipeline.groupthought.com/sections/list-of-sections/product-grid.md?ask=<question>
```

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.
