# Timeline archive > A history set as a contact sheet: eight square photographs four across in two tight rows, each filed under a currentColor hairline with the date in wide-tracked caps and three or four words of title. Nothing carries a paragraph. The heading and lede above are generous and set to a measure, and the sheet below is packed, so one section holds two densities. Example images are included and can be replaced in the editor. States no colour and no font of its own. Canonical: https://patternpaste.com/pattern/timeline-archive.html Section: Timeline Access: Included in Pattern Paste access. Needs: Requires a block theme on WordPress 7.0 to 7.1. 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. Blocks: column, columns, group, heading, image, paragraph Keywords: timeline, history, archive, contact sheet, photographs, grid, captions Promise: Identical markup in every theme. --- ## The signature moment: density contrast against an airy opening **The signature is that one section holds two densities.** Above, the eyebrow, the heading and the lede are given a spacing-70 run of air and the lede is held to a 40rem measure, so the opening breathes like the top of an essay. Below, the sheet is packed: the gap between frames is `clamp(0.5rem, 1.2vw, 0.75rem)`, the same value between the two rows as between the cells, captions are small, and eight dated frames sit hard against each other on one screen. The switch from one density to the other, in the same band and on the same ground, is what makes the archive read as an archive rather than as a gallery with dates on it. **Nothing here is at display size except the section heading, and that is the point.** Every caption, the date and the title alike, sits at a `clamp()` floored at 0.9375rem. A contact sheet is not a place where any one frame is louder than the others; the moment a date is set at 3rem the sheet becomes a timeline with a favourite. The heading carries the whole of the section's scale so the sheet can stay flat. ### How a cell is built Each cell is a `core/group` holding a populated `core/image` at `aspectRatio` `1/1` with `scale: cover`, then a second group carrying a 1px `currentColor` `border-top` and the two caption lines. The rule belongs to the caption, not to the image, so it sits under the frame like the line on a filing card and follows your text colour wherever your theme puts it. It cannot resolve to nothing, which a preset colour rung could. The date is uppercase at 0.18em tracking; the title is the same size with no tracking and a tighter line height. That is the only contrast inside a cell, and it is enough to tell a date from a description without a second colour, a second family or a bold weight fighting the heading. ### What happens at 390, stated honestly **The four columns stack.** Core sets `flex-basis: 100%` on a column below 782px and this pattern does not override it, because four across at 390 leaves about 88px a cell and a three-word title ladders into a ribbon at that width. So on a phone the sheet becomes a single column of eight dated frames, read top to bottom. It is a different reading than the sheet gives on a laptop, and it is still an archive: the rule, the date and the title arrive in the same order under every photograph. `isStackedOnMobile: false` was deliberately not set; the measured cost of forcing four across on a phone is worse than the loss of the grid. ## Why it is a history and not a process Nothing is numbered, nothing is counted down, and no caption asks the reader to do anything. The dates mark a monthly selection from a studio image library. The photographs are visual references selected during those months, not historical photographs of the studio or a record of when each source image was taken. It is also not the other patterns in this section. `timeline-rail` is six open entries with a sentence each on one continuous hairline; `timeline-decades` is twenty single lines grouped under decade heads. Neither carries a photograph, and both are read as text. This one is read as pictures, and its captions are shorter than either pattern's shortest line. `timeline-strip` is the closest neighbour: the same eight photographs in one row rather than a sheet, with the titles dropped because there is no room for them. ## What it inherits from your theme - **The typeface.** No font family is stated anywhere. - **Your colours.** `base` for the ground, `contrast` for the type, both ending on a colour WordPress guarantees. Every rule is `currentColor`. - **Your spacing scale.** The air above the sheet and the gap between the frame and its rule are spacing presets, so a theme with a generous scale gets a more generous opening and the density contrast grows rather than shrinks. - **Your photographs.** The image blocks include example photographs. Choose Replace to select your own media; the 1/1 crop is already set. ## What it decides for itself - **Full bleed with a 1240px measure.** - **The tight gap.** `clamp(0.5rem, 1.2vw, 0.75rem)`, used for the gap between cells and between the two rows, so the sheet has one gutter and not two. - **The square crop.** A square is the shape a contact sheet is filed in, and it keeps eight frames the same whatever the buyer uploads. - **The caption ramp.** Both lines at the same size, separated by tracking and line height alone. - **Eight frames.** Four across is a sheet; three would be a gallery and five would need a smaller caption than the floor allows. ## What to change first 1. **The eight photographs.** Select each one in the editor; the crop and the layout are already set. 2. **The captions.** A date and three or four words. Four columns inside a 1240px band are about 290px at 1280 and about 190px at 820, which is the width the three-word floor was set against; anything longer ladders there. If your titles want to be sentences, the section wants `timeline-rail`. 3. **The heading and lede.** Written to say the section is a sheet of eight. If you add a row, say so there too. 4. **The number of frames.** Duplicate a row for eight more. Keep the count a multiple of four so the sheet has no short last row, which is the one thing that makes a contact sheet read as unfinished. 5. **The shape.** Ship this one where the section is a block on the page that the reader stops at, and `timeline-strip` where it is a band that wants to be crossed in one pass; the strip is the same eight frames in a single row, captioned by the date alone. ## Notes - Core blocks only. No plugin, no script, no separator, no `core/gallery`. - Grid layout on `core/group` was deliberately not used: the two `core/columns` rows are the shape that is the portable shape in the themes this catalogue is verified in. - Example photograph URLs travel with the copied markup; see [image credits](/image-credits/). ## 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.