# Feature chapters view

> One photograph, six looks: the frame holds a single scene and the camera moves across it as you read, panning and zooming to the part each chapter points at with a soft spotlight on it, and the last chapter lets the whole picture go. The chapters you are not reading fade back, and on a phone or a tablet the photograph is the whole screen with the chapters passing over it on plates. Every chapter is a cover block whose focal point is where the camera looks, so you set the six points in the editor with the ordinary focal point picker. Nothing moves until you scroll. The photographic chapters include the same example image; replace it consistently across those covers. Needs the companion plugin, which comes with your access; without it, or without motion, the masthead is followed by the six chapters as a plain stack. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/feature-chapters-view.html
Section: Features
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 6.7 to 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
Also needs: Install the Pattern Paste plugin first, then paste. This section embeds one of its blocks: the plugin comes with your access, downloads from your account, and takes a minute. Paste without it and the section arrives as a plain stack of your headings, text and images, with none of the motion.
Blocks: button, buttons, cover, group, heading, paragraph, patternpaste/chapters
Keywords: camera, one photograph, pan, zoom, scrollytelling, chapters, sticky, view, tour, spotlight

Promise: This variation embeds one of our blocks: install the companion plugin, then paste.

---

## The signature moment: one scene, and a camera that carries the frame to the part each chapter is about

This is the ordinaryabundance.com mechanism in core blocks: nothing swaps.
There is one photograph, and reading down it is walking around inside it. The
first five chapters each point at one part of the view (the open water, the blue surface,
the green foreground, the coastal edge and the water beyond the walls) and the frame
pans and zooms there over the block's swap time, with the rest of the scene
veiled in the page's own ink so the part being talked about is the part that
is lit. The sixth chapter has no cover, so the camera pulls back to the whole
view and the veil lifts: the section ends on the picture it began with, now
read.

Scroll back up and the camera retraces its route. Nothing moves until you
scroll, and nothing moves after you stop.

## Why this is not editorial-chapters-case, team-chapters-index or timeline-chapters-years

- **One picture, not six.** Every other chapters composite gives each chapter
  its own photograph and swaps them. Here every chapter is a cover pointed at
  the SAME photograph and the frame never changes what it holds, only where it
  is looking. That is a different thing to author (one good photograph and six
  focal points, set with the ordinary focal point picker) and a different
  thing to read.
- **The morph is off and the plate is off**, and both follow from the camera:
  a frame that pans wants one shape to pan inside, and a mount around a
  photograph the reader is moving through reads as a porthole. The window is
  the stage box, and the photograph fills it at every zoom.
- **The spotlight is the only one of the set that veils the picture.** At 55
  the parts of the scene the chapter is not about drop back under the page's
  ink, which on a light theme darkens and on a dark theme fogs; the hole at
  the point is soft and about a quarter of the frame across. It lifts on the
  resting chapter, so the whole view is seen clean twice: at the top and at
  the end.
- **The fade is 45**, between the index's 40 and the case study's 50: a
  chapter here is two paragraphs about one thing in the picture, and it wants
  to be read while the camera is on that thing.
- **The rest chapter is the ending.** The timeline's interludes keep the
  previous print; a camera rest is the opposite, the camera letting go. It is
  the one chapter that must have no cover.

## What it inherits from your theme

- **Typeface.** Nothing states a family.
- **Palette.** The band is your `base` with your `contrast` as its ink; the
  two labels lead on `role-label` and fall through to `contrast`; the button
  is your theme's outline button style. The spotlight's veil is
  `currentColor` mixed down, so it is your ink, not ours.
- **The measure.** Each chapter's prose is inside a `Plate` group at 36rem on
  your `base`, invisible on the band at two columns and the thing the words
  sit on when the photograph is the screen. Never take the plate away.
- **The ladder.** The masthead is `x-large`, every chapter title `large`,
  every paragraph `medium`, each as a chain with a tuned `clamp()` behind it.

## What it decides for itself

- **Six chapters, five of them pointed.** Five looks is enough to walk a
  photograph without running out of things in it; the sixth is the whole.
- **The zoom, at 190.** Nearly twice the resting size: enough that a point in
  a wide scene fills the frame, not so much that the photograph turns to
  pixels. A very high-resolution photograph can take more.
- **The band, at 720.** A chapter is two paragraphs, a little under the band
  at the theme's measure, so the next chapter's label is on screen faded
  beneath the one being read.
- **The rail on the right**, so the words lead and the picture answers them.
- **The masthead is outside the block** and **the hand-off row is a sibling
  after it**, both inset by the block's gutter.

## What needs the plugin

This pattern embeds `patternpaste/chapters`, a dynamic block registered by the
companion plugin, which comes with your access. Install it before pasting, or
the block shows the missing-block placeholder in the editor.

- **With the plugin and motion off** (the inspector switch, and also what the
  storefront's still picture and the contact sheet show): the two-column
  spread, every chapter's cover beside its own words, each showing the
  photograph at its own focal point, the sixth chapter with no picture.
- **With the plugin deactivated entirely**: the masthead is followed by the
  six chapters as a plain stack of core blocks, each cover above its own
  words, and then the hand-off row.
- **A reader who has asked for reduced motion** gets the still spread.
- **On a phone or a tablet in portrait, with the plugin and motion on**, the
  block goes live on the screen: the photograph is the whole screen behind the
  chapters, which pass over it on their plates, and the camera moves exactly as
  it does in the frame. With motion off, or without the plugin, it is the
  one-column stack.

## What you change first

1. **The photograph.** Each photographic chapter includes the same example image; when replacing it, point all the photographic covers at one file from your media library. The camera uses the first
   chapter's picture as the scene and ignores the others' files, but the still
   spread and the phone show each cover, so they should all be the one picture.
2. **The points.** Select each cover and drag the focal point picker in the
   block sidebar to the part of the photograph that chapter is about. That is
   the whole of the camera's authoring.
3. **The words.** Two paragraphs a chapter, about the thing at the point,
   inside the `Plate` group. Add a chapter by duplicating a `Chapter` group;
   leave one chapter with no cover where you want the camera to pull back.
4. **The zoom and the spotlight.** `Zoom` and `Spotlight` in the block's
   Motion panel, 190 and 55 here. A spotlight of 0 is a plain pan and zoom.
5. **The band.** `Chapter length` in the inspector, 720 here; raise it for
   longer chapters.
6. **The masthead and the hand-off row.** Ordinary core blocks before and
   after the block.
7. **Motion.** The inspector has the switch and the dials. Turning the camera
   OFF turns this back into a picture-per-chapter section, each cover its own
   frame.
8. **The heading levels.** The masthead is an `h2` and every chapter title an
   `h3`. If this lands under another `h2`, or the page has no `h1`, change the
   masthead's level in the block toolbar.

## What is not proved

- **The judge proves the camera moved to a pointed chapter and kept the frame
  full** (`chapters-camera-still`, `chapters-camera-uncovered`), and that it
  did so again on the way back up. It does not prove the camera looked at the
  RIGHT part of the picture: the point is read off the cover's focal point and
  clamped to the crop, and a point outside the crop lands at its edge.
- **The spotlight's strength is not measured.** The veil is `currentColor`
  mixed down at the percentage stated; on a theme whose ink is pale it fogs
  rather than darkens, which is a look and not a fault, and it has not been
  rendered on such a theme here.
- **The sheet shows five covers of the same photograph**, each at its own
  focal point, followed by the text-only rest chapter. The preview uses the
  same coastal photograph as the copied markup. The storefront's
  picture is photographed live, with the camera on the second chapter's point.

## Included images

The copied markup includes WordPress Photo Directory example photographs. The public image URLs
keep the examples visible after pasting. Select an image or cover and choose
**Replace** to use your own Media Library files. See [image credits](/image-credits/)
for the sources and licenses. Pasting an image URL does not import a Media Library
attachment.
