> For the complete documentation index, see [llms.txt](https://docs.strm.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.strm.design/reference/sections/shop-the-look.md).

# Shop the look

A styled photo with product hotspots and the products listed beside or below it.

A styled photo with product hotspots and the products listed beside or below it.

**Where:** Any template (Add section)\
**File:** `sections/shop-the-look.liquid`

![Shop the look](https://2073252647-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX7okZwFVjG38blUMwqg%2Fuploads%2Fgit-blob-3e18efc7ddf44681cba689e747409dbdb1f160c8%2Fshop-the-look.png?alt=media)

## Section settings

| Setting          | Type                       | Options                                      | Default                   | Notes                                                                          |
| ---------------- | -------------------------- | -------------------------------------------- | ------------------------- | ------------------------------------------------------------------------------ |
| **Layout**       | Choice                     | Product list beside image, Story below image | Product list beside image |                                                                                |
| **Eyebrow**      | Text                       |                                              |                           |                                                                                |
| **Heading**      | Text (bold, italic, links) |                                              |                           |                                                                                |
| **Heading size** | Choice                     | Small, Medium, Large page heading            | Medium                    | Large is a page heading. Use it once per page, for example on a lookbook page. |

> Add more than one look to show tabs and previous and next buttons.

| Setting            | Type         | Options             | Default  | Notes |
| ------------------ | ------------ | ------------------- | -------- | ----- |
| **Color scheme**   | Color scheme |                     | Scheme 1 |       |
| **Top padding**    | Slider       | 0–160px, steps of 4 | 48px     |       |
| **Bottom padding** | Slider       | 0–160px, steps of 4 | 48px     |       |

## Blocks

### Look block

One look in Shop the look: an image with hotspots, a heading and text.

| Setting                        | Type                       | Options | Default | Notes |
| ------------------------------ | -------------------------- | ------- | ------- | ----- |
| **Image**                      | Image                      |         |         |       |
| **Tab label**                  | Text                       |         | Look    |       |
| **Eyebrow**                    | Text                       |         |         |       |
| **Heading**                    | Text (bold, italic, links) |         | Heading |       |
| **Text**                       | Rich text                  |         |         |       |
| **Show add all to bag button** | On / off                   |         | On      |       |

> Add product hotspots and set their position on the image.

Accepts: Hotspot

## Presets

Add it from **Add section** as: **Shop the look**, **Lookbook**.