# Product list

### Section overview

The Product List section displays products from a selected collection as a list of titles, where hovering each title reveals the product's image alongside it.

#### Common Use Cases

* Creating a minimal, elegantly styled product showcase
* Highlighting featured or curated products with hover effects
* Creating interactive product menus with visual feedback
* Presenting collections in a space-efficient way for lookbooks or catalogs

#### Usage Tips

* For the best hover effect experience, use high-quality product images with consistent dimensions
* Keep product titles concise to maintain a clean appearance in list format
* Enable margin settings for better spacing on larger screens
* Consider mobile users' experience where hover effects aren't available
* Adjust image height to ensure images appear correctly sized when revealed

### Section Settings

| Setting              | Description                                                                |
| -------------------- | -------------------------------------------------------------------------- |
| Collection           | The collection of products to display in the list                          |
| Products count       | Maximum number of products to display (default: 7)                         |
| Top spacing          | Adjust the spacing above the section (0-300px)                             |
| Bottom spacing       | Adjust the spacing below the section (0-300px)                             |
| Color scheme         | Select from theme color schemes or choose custom                           |
| Custom color         | Select a custom background color when using the custom color scheme        |
| Text color           | Option to override text color (default, force light, force dark)           |
| Border color         | Choose between subtle or strong border color                               |
| Enable color fade    | Enable background color transition when scrolling into view                |
| Border position      | Select where borders appear (none, top, bottom, or both)                   |
| Horizontal alignment | Align content left, center, or right                                       |
| Image height         | Adjust the size of the revealed product images (20-600px)                  |
| Enable margin        | Apply horizontal margin from global theme settings                         |
| Visibility           | Control section visibility across devices (all, mobile only, desktop only) |
| Show prices          | Display product prices alongside titles                                    |
| Show rating text     | Display product rating information                                         |
| Show tagline         | Display product subtitle/tagline if available                              |

### Block Settings

This section does not contain configurable blocks.


---

# 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://help.brickspacelab.com/space/sections/products-and-collections/product-list.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.