> For the complete documentation index, see [llms.txt](https://easify.gitbook.io/easify-box-bundle-builder-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://easify.gitbook.io/easify-box-bundle-builder-docs/user-guide/visual-editor/product-list.md).

# Product List

Easify Box Builder provides multiple ways to display products inside your box builder: **Grid, Carousel, Tabs,** and **Accordion**. Each layout changes how shoppers browse and select products, and choosing the right one can improve the shopping experience.

{% hint style="success" %}
Explore this [demo to product display](https://easify-box-bundle-builder.myshopify.com/apps/box-builder/product-list-grid-carousel-tabs-accordion) to see the product list in action.
{% endhint %}

### 1. Product List: Grid

The **Grid layout** displays products in a clean, evenly spaced format. Each item is shown side by side, making it easy for customers to scan multiple options at once.

> Every other layout (Carousel, Tabs, Accordion) is **built on top of the Product List: Grid.** This means the Grid provides the base settings of a product list, while other layouts add different ways to navigate or interact with them.

**Best for:** Stores with a wide range of products where visual comparison is important.

**Advantages:**

* Simple and familiar layout for most shoppers.
* Provides equal visibility for all products.

👉 Learn more in our full guide to the [**Product List: Grid**](/easify-box-bundle-builder-docs/user-guide/visual-editor/product-list/product-list-grid.md)

![](/files/6f1a3947e58e1a7fcfc8d5a4d908f3bc4367586c)

### 2. Product List: Carousel

The **Carousel layout** lets customers swipe or scroll horizontally through products.

**Best for:** Highlighting a smaller set of products or featured items.

**Advantages:**

* Saves vertical space on mobile devices.
* Creates an interactive browsing experience.
* Keeps customers engaged with smooth scrolling.

👉 Learn more in our full guide to the [**Product List: Carousel**](/easify-box-bundle-builder-docs/user-guide/visual-editor/product-list/product-list-carousel.md)

![](/files/6dce7c6dbc50a08b87123a0f6fbac1b5734f09f9)

### 3. Product List: Tabs

The **Tabs layout** organizes products into categories, allowing customers to switch between sections without leaving the page.

**Best for:** Stores with distinct product groups (e.g., food, drinks, accessories).

**Advantages:**

* Keeps the interface clean by separating categories.
* Helps customers find products faster.

👉 Learn more in our full guide to the [**Product List: Tabs**](/easify-box-bundle-builder-docs/user-guide/visual-editor/product-list/product-list-tabs.md)

![](/files/d117047b01aa2f3758957fc93ee4b122bf26cdb6)

### 4. Product List: Accordion

The **Accordion layout** collapses and expands sections, showing only one category at a time. Customers can click to reveal more options as they browse.

**Best for:** Stores with large product lists where space management is important.

**Advantages:**

* Keeps the page compact and organized.
* Reduces scrolling by hiding unused sections.

👉 Learn more in our full guide to the [**Product List: Accordion**](/easify-box-bundle-builder-docs/user-guide/visual-editor/product-list/product-list-accordion.md)

![](/files/87bf2fc88dadd43fdaf652fa3acc2966cd551008)

By selecting the right layout, you can make your box builder more intuitive and enjoyable for shoppers!

### 💬 Need Help?

Questions? Stuck somewhere?

We’re always here to help! Just reach out via our **in-app live chat** for 24/7 support.


---

# 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:

```
GET https://easify.gitbook.io/easify-box-bundle-builder-docs/user-guide/visual-editor/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.
