> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kwebby.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Featured product

> One product with its own gallery and buy box on the home page or any other page, built from the product page's buy box blocks.

![Featured product on the storefront](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/featured-product.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=5b9db42879d00784157f49681821ac5f)

Featured product, highlighted with the demo content

## Where to find it

On the home page on a fresh install, below Shop the setup, with no product chosen: it shows a placeholder until you pick one. In the theme editor choose Home page and select Featured product. To add another, open any page, click Add section and choose Featured product.

## How it works

* The gallery (photos, videos, YouTube and Vimeo, 3D models) sits beside the buy box; under 900 px they stack.
* Blocks: Vendor, Title, Type and SKU, Rating, Price, Shop Pay Installments, Description, Variant picker, Purchase options, Gift card recipient, Key specs, Stock, Buy buttons, Pickup availability, PC compatibility, Compare and share, Text, Custom Liquid and app blocks. They behave as on the product page; the Compare box shows only when Theme settings → Compare → Compare page is set.
* Changing an option updates the price, stock and buttons in place. The address bar does not change.
* Key specs show as a two-column grid, one column on phones.
* The product title is a second-level heading, so the page keeps one main heading.
* Protection plans, the size guide, Delivery estimate, Trust badges, the details below and the sticky bar belong to the product page only.
* Without a product it shows a placeholder: a sample name, a zero price and a disabled Add to cart button.

![Featured product in the theme editor](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/editor-featured-product.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=5362bf33c415cb622f1d5705356873c0)

In the theme editor: 1 Featured product · 2 its settings, with no product chosen yet · 3 the placeholder it shows until you pick one

## Edit it

* Choose the Product. Pick one with good photos and some key specs (Theme settings → Product cards → Spec rows).
* Keep Show Full details link on, so shoppers can reach the full product page.
* Under Media set Photo fit (Show the whole photo on install; Fill the frame crops photos that are not square), Show thumbnails, Zoom photos in a lightbox (off on install here) and Product videos.
* Buy buttons starts with Quantity selector set to Number box and Show dynamic checkout button off; change them in the block if you like.
* Add, remove and reorder blocks as on the product page.

## Settings

| Setting | What it does |
| - | - |
| **Product** | Choose a product. |
| **Color scheme** | Color scheme for this area (edit the schemes in Theme settings → Colors). Default: Scheme 1. |
| **Show Full details link** | On or off. Default: on. |

**Media**

| Setting | What it does |
| - | - |
| **Photo fit** | Options: Show the whole photo, Fill the frame. Fill the frame crops photos that are not square. Default: Show the whole photo. |
| **Show thumbnails** | On or off. Default: on. |
| **Zoom photos in a lightbox** | On or off. Default: off. |
| **Product videos** | Options: Play muted while on screen, Play with controls. Muted videos never play for visitors who reduce motion or save data, and always have a pause button. Default: Play muted while on screen. |

## Blocks

Add a block with **Add block** under the section in the sidebar; drag blocks to reorder them.

### App blocks

Blocks from apps you have installed, such as reviews or subscriptions. Click **Add block** and choose one from the Apps tab; its settings come from the app.

### Vendor (up to 1)

| Setting | What it does |
| - | - |
| **Link to the vendor's products** | On or off. Default: off. |

### Title (up to 1)

No settings: add or remove it, and drag it into place.

### Type and SKU (up to 1)

| Setting | What it does |
| - | - |
| **Show product type** | On or off. Default: on. |
| **Show SKU** | On or off. Default: off. |

### Rating (up to 1)

> [!TIP]
>
> Shows the stars a reviews app writes to the reviews.rating and reviews.rating\_count metafields.

### Price (up to 1)

| Setting | What it does |
| - | - |
| **Show badges** | On or off. Default: on. |
| **Show tax and shipping note** | On or off. Default: off. |

### Shop Pay Installments (up to 1)

No settings: add or remove it, and drag it into place.

### Description (up to 1)

No settings: add or remove it, and drag it into place.

### Variant picker (up to 1)

| Setting | What it does |
| - | - |
| **Show color swatches** | On or off. Default: on. |

### Purchase options (up to 1)

No settings: add or remove it, and drag it into place.

### Gift card recipient (up to 1)

No settings: add or remove it, and drag it into place.

### Key specs (up to 1)

| Setting | What it does |
| - | - |
| **Specs to show** | Slider from 2 to 8, in steps of 2. Default: 4. |

### Stock (up to 1)

| Setting | What it does |
| - | - |
| **Say In stock above the low stock level** | On or off. Default: on. |

### Buy buttons (up to 1)

| Setting | What it does |
| - | - |
| **Show quantity selector** | On or off. Default: on. |
| **Quantity selector** | Options: Minus and plus buttons, Number box. Default: Number box. |
| **Show dynamic checkout button** | On or off. Default: off. |

### Pickup availability (up to 1)

No settings: add or remove it, and drag it into place.

### PC compatibility (up to 1)

| Setting | What it does |
| - | - |
| **Show Add to a PC build** | On or off. For products with the parts tag from Theme settings, PC Builder. Needs the PC Builder page. Default: on. |

### Compare and share (up to 1)

| Setting | What it does |
| - | - |
| **Show Compare** | On or off. Default: on. |
| **Show Share** | On or off. Default: off. |

### Text

| Setting | What it does |
| - | - |
| **Text** | Formatted text. |

### Custom Liquid

| Setting | What it does |
| - | - |
| **Liquid code** | Liquid code. |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.