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

# Page hero

> The top of a content page: breadcrumbs, an eyebrow, the page title as the main heading, an introduction and a link, with an optional film or photograph behind it.

![Page hero on the storefront](https://mintcdn.com/kwebby/Y7lUE3PaLXfHjaRp/images/vesper/page-hero.webp?fit=max\&auto=format\&n=Y7lUE3PaLXfHjaRp\&q=85\&s=7f116c2b60d1af33b22035d364d2f673)

Page hero, highlighted with the demo content

## Where to find it

The first section of the About, Boutiques, Contact, Events, Gallery and Questions and answers templates. In the theme editor choose Pages, pick the template, then select Page hero.

## How it works

* Title only shows the heading over the page background.
* Film or photograph behind the title shows the photograph, or a Shopify-hosted film playing muted on a loop, behind the heading (the About page uses it). The film never plays with reduced motion or data saving, and its pause button appears for keyboard users.
* An empty Title uses the page's own title.
* Show the page's content adds the text written for the page in Online Store, Pages under the introduction.

![Page hero in the theme editor](https://mintcdn.com/kwebby/ipMVAv6ECVUC3DoM/images/vesper/editor-page-hero.webp?fit=max\&auto=format\&n=ipMVAv6ECVUC3DoM\&q=85\&s=6ab10a498b2b80d503b74c60ba926349)

In the theme editor: 1 the section in the sidebar · 2 its settings · 3 the section in the preview

## Edit it

* Choose Layout, then edit Eyebrow, Title and Introduction.
* Add a Link label and Link. To jump to a section on the same page, type # and that section's anchor, for example #founder.
* For the photograph layout, upload a Photograph of 2400 x 1400 px or larger, and optionally a Film under 3 MB.

## Settings

| Setting | What it does |
| - | - |
| **Color scheme** | Color scheme for this area (edit the schemes in Theme settings → Colors). Default: Scheme 1. |
| **Layout** | Options: Title only, Film or photograph behind the title. Default: Title only. |
| **Show breadcrumbs** | On or off. Default: on. |
| **Eyebrow** | Text. |
| **Title** | Text. Leave empty to use the page's own title. This is the page's main heading. |
| **Introduction** | Formatted text (one line). |
| **Show the page's content** | On or off. Shows the text written for this page in Online store, Pages under the introduction. Default: off. |
| **Link label** | Text. |
| **Link** | Link: a page, product, collection or web address. To link to a section on the same page, enter # and that section's anchor, for example #founder. |

**Media**

> [!TIP]
>
> Used with the layout Film or photograph behind the title.

| Setting | What it does |
| - | - |
| **Photograph** | Image: upload one or choose from Content → Files. Also the film's poster. 2400 by 1400 pixels or larger. |
| **Film** | Video: upload one or choose from Content → Files. Shopify-hosted. Plays muted on a loop while on screen and never when the shopper asks for reduced motion or saves data. Keep it under 3 MB. |


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