# Quick view

![](https://docs-assets.foxecom.app/motrix-theme/06e3497f-5172-49cd-96ca-ce2f90643ac0.png)

A shopper browsing a grid of products can open the preview, look through the photos, choose a size or colour, and buy — all without losing their place in the grid. Set it up once here and it applies on every page of the store.

## When it opens

Two things open this panel:

* The quick view control on a product card. 
* Quick add on a product that has options — the shopper taps **Choose options** and lands here instead of adding straight to the cart.

Because both routes share one panel, whatever you set up here is also what a quick-add shopper sees.

See how to customize your [Product cards](https://docs.foxecom.com/motrix-theme/theme-settings/product-cards).

<Video src="https://docs-assets.foxecom.app/motrix-theme/3669771d-6dec-41ca-8c7c-1d345574f2b7.mp4" autoPlay="true" loop="true" muted="true" />

## Section settings

<Table widths="30%">
  | Setting   | What it does                                                                                        |
  | --------- | --------------------------------------------------------------------------------------------------- |
  | **Style** | Modal opens the preview in a centred window over the page. Drawer slides it in from the right edge. |
</Table>

<Tabs>
  <Tab title="Style: Modal">
    ![](https://docs-assets.foxecom.app/motrix-theme/c2ec91d5-9da5-4854-9b6a-495152eb5002.png)
  </Tab>

  <Tab title="Style: Drawer">
    ![](https://docs-assets.foxecom.app/motrix-theme/2851134c-87d6-4669-b382-ece7dc9ca5e0.png)
  </Tab>
</Tabs>

Modal suits stores with rich product media, since a centred window gives the gallery more room. Drawer keeps the page visible behind it, which reads as less of an interruption when shoppers are comparing several products in a grid.

You can change the color of Quick view in **Theme settings** > [Dialogs](https://docs.foxecom.com/motrix-theme/theme-settings/dialogs).

## Blocks

The content is built from blocks, so you decide what appears and in what order, much like editing a product page. Alongside any theme block and app blocks, you can add product blocks to the Quick view.&#x20;

See [Which blocks you can add](https://docs.foxecom.com/motrix-theme/product-page/product-information#which-blocks-you-can-add) to the Product details.

![](https://docs-assets.foxecom.app/motrix-theme/3406657f-7f00-474b-bfea-72a1d58cd978.png)

<Hint type="info">
  The **View details button** sits below your blocks and links to the full product page. It is part of the panel, so it can be hidden but not reordered or removed.
</Hint>

## Troubleshooting

### Quick view or quick add loads forever

A customer taps quick view, or taps quick add on a product with options, and the button spins without anything opening.

In almost every case the **Quick view section is hidden**. The buttons on your product cards still appear and still fetch the product, but there is no panel left for them to open, so the spinner never resolves.

Here's how to fix it:

1. In the theme editor, navigate to the **Overlay group** in the sidebar.
2. Look at **Quick view.** A crossed-out eye next to it means the section is hidden.
3. Click the eye to unhide it, then click **Save.**
4. Reload your storefront and try quick view again.

![](https://docs-assets.foxecom.app/motrix-theme/fce4bb10-d5a7-493a-93ab-1b931bf0366b.png)

Still spinning after unhiding the section? Get in touch with support and tell us which product and which page it happens on.

## Tips

* Keep the block list short. Quick view works best as a fast summary that gets a shopper to a decision, with the full product page one tap away. Media, title, price, variant picker, and buy buttons cover most stores.
* Add Description only if your descriptions are short. A long one pushes the variant picker and buy buttons out of view, which defeats the point of the panel.