Guide: contents beside, Pattern Paste Canonical: https://patternpaste.com/pattern/article-guide-sidebar.html Library (https://patternpaste.com/patterns/) Single articles (https://patternpaste.com/patterns/single-articles/) Catalogue access Standard # Guide: contents beside A full five-chapter reference article with descriptive contents links and a short note in the left rail. Longer prose, a checklist, a photograph and a practical recap demonstrate the layout over a realistic reading distance. Core blocks only, with editable sample content and no plugin required. Inherits your theme’s colours and typeface. Start here ## What to change first Replace the sample text, then add or remove complete sections in List View. Replace any example photograph through the Image block. Photographs in the payload are included public source URLs with descriptive alternative text; no foreign attachment ID travels with them. Edit the alternative text to match your replacement. Check long headings and paragraphs on a phone. The contents uses hand-edited core button links with matching heading anchors. It is not sticky and does not track the current section. Update links and anchors together; use unique anchors if pasting more than one copy into a page. The signature moment ## A short contents rail gives the guide a second left edge A full five-chapter reference article with descriptive contents links and a short note in the left rail. Longer prose, a checklist, a photograph and a practical recap demonstrate the layout over a realistic reading distance. Theme handoff ## What comes from where ### From your theme The theme supplies the typeface, heading leading and weight, link treatment, and spacing scale. Colours use contrast and base fallback chains ending in core black and white. Incidental uppercase labels start with role-label. Structural borders use currentColor. No accent carries text. ### Set by this pattern The composition and its relative widths are authored. Body copy uses the medium preset with a readable clamp fallback and 1.6 line height. Section headings use x-large; smaller headings use large. All headings state their own ink chain. Narrow groups keep the theme's content measure. Columns stack below WordPress's mobile breakpoint; automatic grids reflow according to their minimum track width. There is no fixed-height reading area. 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 full five-chapter reference article with descriptive contents links and a short note in the left rail. Longer prose, a checklist, a photograph and a practical recap demonstrate the layout over a realistic reading distance. ### The signature moment: a short contents rail gives the guide a second left edge A full five-chapter reference article with descriptive contents links and a short note in the left rail. Longer prose, a checklist, a photograph and a practical recap demonstrate the layout over a realistic reading distance. Make it yoursVariations and the edits to make first ### What to change first Replace the sample text, then add or remove complete sections in List View. Replace any example photograph through the Image block. Photographs in the payload are included public source URLs with descriptive alternative text; no foreign attachment ID travels with them. Edit the alternative text to match your replacement. Check long headings and paragraphs on a phone. The contents uses hand-edited core button links with matching heading anchors. It is not sticky and does not track the current section. Update links and anchors together; use unique anchors if pasting more than one copy into a page. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits The theme supplies the typeface, heading leading and weight, link treatment, and spacing scale. Colours use contrast and base fallback chains ending in core black and white. Incidental uppercase labels start with role-label. Structural borders use currentColor. No accent carries text. ### What it decides The composition and its relative widths are authored. Body copy uses the medium preset with a readable clamp fallback and 1.6 line height. Section headings use x-large; smaller headings use large. All headings state their own ink chain. Narrow groups keep the theme's content measure. Columns stack below WordPress's mobile breakpoint; automatic grids reflow according to their minimum track width. There is no fixed-height reading area. ### Display type Small labels and narrow supporting copy keep a clamp from 15px to 16px. Uppercase labels use 0.08em tracking. No heading uses a display size outside the theme's ladder. ### Contrast and verification All reading text, labels and links are held to 4.5:1. Large headings are held to 3:1. The scoped verify:pattern run checks editor validity at both supported WordPress targets, responsive layout, colour contrast and theme renders. The verification sheet is under .wp-verify/sheets/article-guide-sidebar/sheet.png. Technical notesBlock mechanics, responsive behaviour and constraints ### Where to paste it Paste into a post or page's content area. This is an editable content pattern, not a Single Post template. Your theme supplies the post title, date and site header; this payload has no duplicate h1 or dynamic post-context requirement. It works with ordinary core blocks and needs no companion plugin. ### Sample content The sample is a complete guide to making a home workspace in a shared room. Its contents rail is manually edited, non-sticky and does not track the current chapter. Keep the anchor links in sync when editing the five chapters. 29KB of core-block markup, 10 blocks (button, buttons, column, columns, group, heading, image, list, list-item, paragraph), and nothing else: paste it into the block editor and it becomes editable blocks wearing your theme. Start free trial to copy (https://patternpaste.com/account/#plan) What you copy is yours forever. Cancel whenever. Back to the library (https://patternpaste.com/patterns/) Catalogue access ### £70 a year Save £50 Or £10 a month All patterns, variations and theme downloads. What you copy is yours forever. Cancel whenever. Start with three days of full access on sign-up, no card. Start free trial (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. Cancel any time; access runs to the end of the period you have paid for, and there is no pro-rata refund. 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. #### Use it for - Longer guides - Reference articles #### Before you paste 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. How we test patterns (https://patternpaste.com/how-we-test/) Sample images stay in the copied blocks. Replace them in WordPress; pasting does not upload them to your Media Library. Video variations need your own clip. Image credits (https://patternpaste.com/image-credits/). #### What's inside Blocks button, buttons, column, columns, group, heading, image, list, list-item, paragraph Core only yes Chains 76, deepest 3 rungs currentColor yes color base, black, contrast, role-label, role-link, white spacing 40, 50, 60 font-size large, medium, x-large Continue exploring ## Next in Single articles Explore all 13 Single articles patterns (https://patternpaste.com/patterns/single-articles/) Shot in Twenty Twenty-Five Single articles Single articles Standard ### Guide: contents above A complete five-chapter guide with a linked contents box above the reading column. 9 blocks Open preview (https://patternpaste.com/pattern/article-guide-index.html) Shot in Twenty Twenty-Five Single articles Single articles Standard ### How-to article: sequence A complete five-step photography tutorial with an introduction, preparation checklist, illustrated instructions, a comparison note and a final review. 6 blocks Open preview (https://patternpaste.com/pattern/article-howto-sequence.html) Shot in Twenty Twenty-Five Single articles Single articles Standard ### How-to article: workbench A substantial project walkthrough that opens with a finished photograph beside preparation notes, followed by five numbered instruction rows. 8 blocks Open preview (https://patternpaste.com/pattern/article-howto-workbench.html)