Newsprint columns: WordPress Block Pattern, Pattern Paste Canonical: https://patternpaste.com/pattern/newsprint-columns.html Core Patterns (https://patternpaste.com/patterns/) Editorial (https://patternpaste.com/patterns/editorial/) Catalogue access Standard # Newsprint columns A magazine body: a running head on a rule, a wide headline, then the prose packed into two true text columns under it with numbered footnotes gathered on a rule at the foot. Dense where the reading is and airy where it is not. ## All patterns Search patterns Loading patterns… Start here ## What you change first - The running head and folio. Section name left, number right. - The headline. Up to about twelve words. - The body. Two paragraphs per column. - The footnotes. One per column. The signature moment ## Airy head, packed body Density contrast. The top of the section is almost empty: a 14px running head and a folio number at the two ends of a rule, then a headline at up to 60px held to 48rem with air around it. Then the body arrives as two 50% columns of 16 to 18px prose on a 1.65 line height with a 3.5rem gutter, and the section is suddenly dense, the way a page of a broadsheet is dense below its headline. The footnote strip repeats the head's device at the foot: a wide rule, then two columns of 14px notes keyed to superscripts in the body. Theme handoff ## What comes from where ### From your theme - Typeface. - Palette. - Both rules. - Spacing rhythm. ### Set by this pattern - The band - Body proportion - Footnotes Full pattern notes ## Why it works, and how it is built Open a topic for the complete design reasoning, editing guidance and implementation notes. Design rationaleComposition, intent and nearest alternatives ### Overview A magazine body: a running head on a rule, a wide headline, the prose packed into two true text columns under it, and numbered footnotes gathered on a rule at the foot. core/group, core/columns, core/paragraph, core/heading and core/separator. ### The signature moment: airy head, packed body Density contrast. The top of the section is almost empty: a 14px running head and a folio number at the two ends of a rule, then a headline at up to 60px held to 48rem with air around it. Then the body arrives as two 50% columns of 16 to 18px prose on a 1.65 line height with a 3.5rem gutter, and the section is suddenly dense, the way a page of a broadsheet is dense below its headline. The footnote strip repeats the head's device at the foot: a wide rule, then two columns of 14px notes keyed to superscripts in the body. Make it yoursVariations and the edits to make first ### What you change first - The running head and folio. Section name left, number right. - The headline. Up to about twelve words. - The body. Two paragraphs per column. To add, copy a paragraph into the column that is shorter, so the two columns end near the same line. - The footnotes. One per column. Remove the markers from the body if you remove the notes. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - Typeface. None stated. This is the pattern most changed by a serif theme, and it was drawn for that: two columns of Cardo look like a newspaper, two columns of Manrope look like a report. - Palette. base ground, contrast text, two-rung chains. The headline carries its colour explicitly. - Both rules. core/separator blocks stating no colour. - Spacing rhythm. Core spacing presets. ### What it decides for itself - The band: 66rem. The gutter: 3.5rem. The headline measure: 48rem, as a nested left-justified constrained group rather than a padding-right on the heading. - Body proportion: clamp(1rem, 1.25vw, 1.125rem) on 1.65, a step smaller and tighter than the single-column editorial patterns because two columns want it. - Footnotes: max(0.875rem, 14px) on 1.55, numbered in bold. ### Contrast Every pair is contrast on base. The headline is large text at 3:1; body, running head and footnotes are held to 4.5:1. Rules carry no text. Technical notesBlock mechanics, responsive behaviour and constraints ### How the columns work The two text columns are one core/columns row with two 50% columns, and the prose is distributed by hand: the left column holds the first two paragraphs, the right holds the next two. This is not CSS multi-column, which core does not expose and which would reflow a paragraph across the gutter; each paragraph lives whole in one column, and the order reads down the left and then down the right. The band is 66rem, so each column is a little under 30rem at full width, which at 17px is 60 to 65 characters: the upper half of the ideal measure, and well inside the 95-character limit. The footnotes are a second core/columns row with the same two widths and the same gutter, so the notes align under the body columns. ### What happens at 390 Both rows stack, which is the one layout decision core makes for you below 782px and exactly the right one here: four paragraphs become one column in reading order, and the two footnotes follow under their rule. The running head wraps to two short lines. The headline floors at 32px. The superscript markers in the body are core's , which every theme renders. Questions ## Newsprint columns: common questions Does Newsprint columns need a plugin? No. It is built only from core WordPress blocks (column, columns, group, heading, paragraph and separator), so it pastes into the block editor with nothing to install. Will Newsprint columns match my theme? Yes. It names no colour or font of its own: every colour, size and space is a preset from your theme, so it takes your theme’s palette and type when pasted. Is Newsprint columns free? It is included with a subscription, with every Core Pattern and variation. 62 Core Patterns are free to copy without one. Which WordPress version does it need? 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. 8.3KB of core-block markup, 6 blocks (column, columns, group, heading, paragraph, separator), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme. Subscribe to copy it, £49 a year (https://patternpaste.com/account/#plan) What you copy is yours forever. Not for you? We refund within 14 days. Back to Core Patterns (https://patternpaste.com/patterns/) Catalogue access ### £49 a year All patterns, variations and theme downloads. What you copy is yours forever. Not for you? We refund within 14 days. Subscribe, £49 a year (https://patternpaste.com/account/#plan) Sign in (https://patternpaste.com/account/) Everything you copy is yours to keep, forever, on any site; access to the rest of the library runs while you subscribe. Not for you? Tell us within 14 days of a payment and we refund you. After that, cancelling stops the next renewal and access runs to the end of the year you have paid for. Prices are in pounds and are the full price in the UK, the US and eleven other countries; elsewhere the checkout adds your local VAT or sales tax. The terms name every country. #### Pair with Hero Hero aperture An opening section on your theme's own paper: a tracked line, a display headline, one short paragraph on a reading measure, and then a picture that stops short of the edge on every side. The signature is the margin: the image is a window cut in the page rather than a band across it, and the paper around it is what you notice. A small opaque plate in the picture's bottom-right corner carries the caption, so no type ever sits on the photograph. The still-image version includes an example photograph; select your own clip for the video version. States no colour and no font of its own. (https://patternpaste.com/pattern/hero-aperture.html)Blog Post featured lead Two Query Loops read as one section: the newest post opens at display size with its featured image, its byline and an excerpt, and the three behind it sit in a rail beside it as ruled date-and-title lines with no picture at all. It reads your own posts, so the lead changes the moment you publish; the preview on this page shows sample posts from our demo site, not yours. States no colour and no font of its own. (https://patternpaste.com/pattern/post-featured-lead.html)Call to action Callout response clock A call-out section where the day is drawn to scale: a label, heading and a call button over one framed bar of three segments whose widths are their hours, 8am to 6pm, 6pm to midnight and midnight to 8am. Each segment carries its hours, how long we take to arrive at display size and the call-out fee under a hairline, and one line under the bar gives the hourly rate after that. On a phone the bar stacks into three rows that still name their hours. States no colour and no font of its own. (https://patternpaste.com/pattern/callout-response-clock.html) #### Before you paste 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. How we test patterns (https://patternpaste.com/how-we-test/) ## Specifications Section Editorial Access Subscription Plugin None, core blocks only Variations 1 Colour From your theme Type From your theme Motion None Blocks column, columns, group, heading, paragraph, separator Presets color 5, spacing 6, font-size 2 WordPress 7.0+ Continue exploring ## Next in Editorial Explore all 13 Editorial patterns (https://patternpaste.com/patterns/editorial/) Shot in Twenty Twenty-Five Editorial No plugin needed ### Figure break A reading column interrupted by one wide photograph: the prose holds a strict measure, the figure breaks out to twice that width, and its caption hangs from a small index at the figure's left edge before the column resumes. Editorial Preview pattern (https://patternpaste.com/pattern/figure-break.html) Shot in Twenty Twenty-Five Editorial No plugin needed ### Open letter A statement set as a letter: a centred eyebrow, headline and short rule open it, the body runs left-aligned at a generous size and line height down one narrow measure, and it closes with a sign-off set in italic at display size. Editorial Preview pattern (https://patternpaste.com/pattern/open-letter.html) Shot in Twenty Twenty-Five Editorial No plugin needed ### Quote break A reading column broken by one quotation: two hairlines run wider than the measure and between them the line is set at display size, with its source on a short rule beneath, before the prose resumes at its own width. Editorial Preview pattern (https://patternpaste.com/pattern/quote-break.html)