# Quick view

<Embed url="https://www.youtube.com/watch?v=soRGzhTpcf4" />

![image](https://docs-assets.foxecom.app/hyper-theme/Hyper%20docs%20screenshot%20do%20not%20delete%20(65)_hu5lko42.jpg)

## What is a Quick view?

The **Product Quick view** option offers several unbeatable benefits:

* Improved shopping experience: It's easier for your customers to select and add any items to cart without loading the whole product age and clicking back-and-forth between the product page and the item pages for details.
* Reduced server load: The product page is not reloaded when the shopper selects this feature.
* Display of discounted pricing and other details: You can utilize the quick view feature to show discounts before the cart page.

You can manage which blocks are shown on the **Quick View** - such as the buy buttons, variant picker, price, SKU, complementary products, badges and tags, etc.\\

## How to enable Quick view

Quick view can be enabled for your **Product cards.**

<Hint type="success">

Steps:

1. In theme editor (Customize), navigate to **Theme settings > Product cards**.
2. Select the option **Enable Quick view button**.

</Hint>

👀 *Learn more:* [Product cards](https://docs.foxecom.com/hyper-theme/theme-settings/product-cards)

## How to customize Quick view

### Change the Quick view type

<Hint type="success">

Steps:

1. In theme editor (Customize), navigate to **Theme settings > Quick view**.
2. Select the type as **Drawer/ Modal**.

</Hint>

Learn more: [Quick view](https://docs.foxecom.com/hyper-theme/theme-settings/quick-view)

<Tabs>
<Tab title="Quick view type as Drawer">

![image](https://docs-assets.foxecom.app/hyper-theme/image_9H8rJAtL.png)

</Tab>

<Tab title="Quick view type as Modal">

![image](https://docs-assets.foxecom.app/hyper-theme/image_lDdBPdL9.png)

</Tab>
</Tabs>

<Hint type="info">

Product media layout in each type is different:

* Drawer: Stacked layout
* Modal: Carousel.

</Hint>

### Customize what is included in the Quick view

<Hint type="success">

Steps:

1. In the theme editor (Customize), locate **Overlay group** > **Quick view**.
2. Make necessary changes.
3. **Save**.

</Hint>

![image](https://docs-assets.foxecom.app/hyper-theme/image_cyuRKbrF.png)

#### Section settings

* **Media:** To know more about media types, see [Product media](https://help.shopify.com/en/manual/products/product-media).
  * **Enable sticky content on desktop**: Allow the content to stay visible as customers scroll through the product details. (for [Quick view type as Drawer](#quick-view-type-as-drawer)).
  * **Enable video looping**: Allow videos in the product media to play continuously.

![image](https://docs-assets.foxecom.app/hyper-theme/image_MfK8jwIJ.png)

#### Block settings

The **Quick View** feature includes multiple blocks to display detailed product information. You can add, remove, or customize them as you like, similar to the [Product information](https://docs.foxecom.com/hyper-theme/collections-and-products/product-page/product-information) section.

![image](https://docs-assets.foxecom.app/hyper-theme/image_HGM4VEFk.png)