Open index, Pattern Paste Canonical: https://patternpaste.com/pattern/faq-open-index.html Library (https://patternpaste.com/patterns/) FAQ (https://patternpaste.com/patterns/faq/) Catalogue access Standard # Open index A FAQ with nothing to click: six numbered entries run down the band as a two-column ledger, the index number and the question on the left, the answer opposite at reading size on a bounded measure, and a wide hairline closing every row. A small tracked label opens the section and a question with its button closes it. Every word is visible at once, which is what a short list, a page that has to read straight through and anything printed need. States no colour and no font of its own. Start here ## What you change first - The copy in the rows. Six questions and six answers, and both halves are read here, so an answer cannot be the place you hide the detail. - The count. A row is a columns block followed by a separator. - The numbers. They are typed, not generated. - The button's destination. It ships with no href, which is what the editor writes before a link is chosen; point it at your contact page. - The answer measure. 32rem. The signature moment ## An index, not an accordion with the arrows taken off Every word is visible at once, and the composition is built so that reads as a decision rather than as a subtraction. A core/details row cannot lose its triangle:

is not a block, the marker is the browser's, and CSS a block attribute cannot express has no business in a pattern. So the way to a FAQ without markers is a different composition, and this is it. Theme handoff ## What comes from where ### From your theme - Typeface. - Palette. - The hairlines. - The button. - Spacing scale. ### Set by this pattern - The 45/55 split. - The answer measure is bounded by the content, not the viewport. - The question is a ladder heading, the number is a paragraph. - The section label is an h2 at 14 to 15px. - Row rhythm. - Where it stacks. - The closing line is a row, not a footer. 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 FAQ with nothing to click. Six numbered entries run down the band as a two-column ledger: the index number and the question on the left, the answer opposite it on the right, a wide hairline closing every row. A small tracked label opens the section and a question with its button closes it. There is no disclosure, no card, no box and no JavaScript of any kind. ### The signature moment: an index, not an accordion with the arrows taken off Every word is visible at once, and the composition is built so that reads as a decision rather than as a subtraction. A core/details row cannot lose its triangle:

is not a block, the marker is the browser's, and CSS a block attribute cannot express has no business in a pattern. So the way to a FAQ without markers is a different composition, and this is it. The number does the job the triangle was doing. Each row opens with a tracked 01 to 06 above its question, which says "there is a fixed, countable set of these" the moment the section comes into view, and says it without anything being interactive. The question then sits on the theme's large rung against an answer at reading size in the column beside it, so the two halves of every row are told apart by scale and position rather than by state. Nothing opens, nothing closes, and nothing is hidden from a visitor who is scanning, from a printer, or from find-in-page. The rules close it. A wide core/separator runs above the first row and under every row after it, at full measure rather than per column, so the ledger reads across the seam and the two columns stay one table. ### Why this is not faq-list, faq-ledger or faq-measure - faq-list is the accordion: a loud header column against six native disclosure rows, the ask outweighing the questions. This one has no header column and no disclosure, and it gives the answers the same standing as the questions. - faq-ledger hangs a repeated topic label in the margin and divides the band with rules of two lengths. Its left column is a grouping device; the left column here is the question itself. - faq-measure refuses the split entirely: one column at the full 1240 with questions at display size. Take this one for a short list, for a page that has to read straight through, and for anything that gets printed. Make it yoursVariations and the edits to make first ### What you change first - The copy in the rows. Six questions and six answers, and both halves are read here, so an answer cannot be the place you hide the detail. Four or five sentences is the ceiling before the row outgrows its question. - The count. A row is a columns block followed by a separator. Copy the pair to add one, delete the pair to remove one, and keep the separator above the first row so the ledger opens on a rule. - The numbers. They are typed, not generated. Renumber by hand after adding or deleting a row; nothing checks them for you. - The button's destination. It ships with no href, which is what the editor writes before a link is chosen; point it at your contact page. If you would rather not have an action here, delete the closing row, but do not replace it with a link inside a sentence: an inline link takes its height from the font's em box, which a pattern stating no font cannot raise to a 44px target. - The answer measure. 32rem. Raise it only if you also widen the right column, because the measure stops against the column edge and a measure wider than its column is no measure at all. Theme behaviourInheritance, fixed decisions and contrast ### What it inherits from your theme - Typeface. No font family is stated anywhere. - Palette. The ground is your base and the type is your contrast, each written as a fallback chain ending on a colour WordPress itself guarantees, so the section paints in a theme with a full palette and still paints in a theme with none. The label and the index numbers ask for the label role first and fall through to the same contrast everywhere else. - The hairlines. They are core/separator blocks with no colour of their own, so they take your theme's separator style: a 1px currentColor rule in both Twenty Twenty-Four and Twenty Twenty-Five, and a 2px currentColor rule in a theme that styles nothing. They cannot blank, because a colour is never named. - The button. It states no colour at all, so elements.button paints it in whatever your theme uses for a filled button. What it states is its padding, which is what makes it a 44px target. - Spacing scale. Section padding, the air above and below each row, the gutter between the two columns and the gap over the closing line are core spacing presets, so the rhythm resizes with your theme rather than against it. ### What it decides for itself - The 45/55 split. Wide enough on the left for a question on the large rung to take two or three words a line, wide enough on the right for the answer to reach its measure without running past it. - The answer measure is bounded by the content, not the viewport. Each answer's padding-right: max(0rem, 100% - 32rem) resolves its percentage against the column's own width, so the answer is exactly 32rem wide wherever the column is wider than that and exactly full width wherever it is not. That is roughly 70 to 80 characters in the faces the stock themes ship. A vw expression in its place drifts with the theme's content width and cannot be tuned once. - The question is a ladder heading, the number is a paragraph. The question takes the large rung as a two-rung chain with a tuned clamp() behind it; the number is body text at 13 to 14px on 0.18em tracking at weight 600. A number wanting to be a label is a paragraph, never a heading with its type bent down. - The section label is an h2 at 14 to 15px. It is the only heading above the questions, so it carries the section in the outline while sitting at label size in the design. Hierarchy here comes from the numbers and the rules, not from making that line large. - Row rhythm. Every row states its own margins and carries its air on the columns block, so the separators butt against the rows and the section reads as one ruled ledger rather than six stacked items. - Where it stacks. Core stacks columns below 782px, so on a phone each row becomes a number, a question and then its answer, in that order, which is the reading order the ledger already had. The separators keep the rows apart, so nothing is lost when the seam goes. - The closing line is a row, not a footer. The last pair is a sentence on the left and the button on the right, set on the same 45/55 grid as the questions, so the invitation lands where the answers have been landing. ### Contrast Every pair in the section is your contrast on your base, which is the pair your theme already ships body copy on, so every piece of text clears 4.5:1 wherever your body copy does. Nothing here leans on the 3:1 allowance for large text, the questions included: their size comes from a preset rung, and a rung guarantees a size only in the theme that defines it. The button reverses the pair, and it is your theme's reversal rather than ours. The hairlines are structural marks in currentColor and carry no text. Technical notesBlock mechanics, responsive behaviour and constraints ### A note on the answer copy The six answers are real answers, not filler, and several make claims about the product rather than about this section. The plugin answer in particular is written to be true under the three axes: the default promise is no plugin at all, a section that needs the companion plugin says so on its own page before you buy, and it stays legible with the plugin switched off. If you keep our copy rather than writing your own, keep it true of what you sell. The sixth answer is written to be replaced. 19KB of core-block markup, 8 blocks (button, buttons, column, columns, group, heading, paragraph, separator), 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. #### Pair with Pricing Pricing cover menu A screen-height cover with three plans set on it like a restaurant menu: a heavy veil of your theme's contrast colour over the photograph, a display headline in the lower left and a narrow ruled price list in the right-hand column, each plan a name and its price on one line and a sentence beneath, hairline rules between, one button under the list. The list drops beneath the headline on a phone. Includes a replaceable example photograph and placeholder prices. States no colour and no font of its own. Ships with a short hand-off row on your theme's paper below it. (https://patternpaste.com/pattern/pricing-cover-menu.html)Tables Compare matrix A capability matrix in a core table: one row per capability, one column for each of the two plans people choose between, and a mark in every cell, with a third plan named in one line under the table instead of a fourth column that would ladder its row headers on a phone. The recommended column is announced by a two-pixel bracket that stands over it and hands off to the table's own hairlines, so nothing is filled and nothing is coloured. Three fixed columns hold roughly 117 pixels each at 390. States no colour and no font of its own. (https://patternpaste.com/pattern/compare-matrix.html)Compare Compact comparison rows A mobile-first responsive comparison layout using stacked capability cards: each row pairs a feature title and summary with a side-by-side comparison block, avoiding horizontal table scrolling on small screens. States no colour and no font of its own. (https://patternpaste.com/pattern/compare-compact-rows.html) #### 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/) #### What's inside Blocks button, buttons, column, columns, group, heading, paragraph, separator Core only yes Chains 30, deepest 3 rungs currentColor no color base, black, contrast, role-label, white spacing 20, 30, 40, 50, 60, 80 font-size large, medium Continue exploring ## Next in FAQ Explore all 13 FAQ patterns (https://patternpaste.com/patterns/faq/) Shot in Twenty Twenty-Five FAQ FAQ Standard ### FAQ measure A single column of seven native disclosure rows running the full 1240 measure, ruled between and above and below. 5 blocks · 1 variation Open preview (https://patternpaste.com/pattern/faq-measure.html) Open measure (https://patternpaste.com/pattern/faq-measure.html#variant=measure-open) Shot in Twenty Twenty-Five FAQ FAQ Standard ### FAQ pillars A three-column architectural layout organizing questions by topic into vertical pillars. 7 blocks · 1 variation Open preview (https://patternpaste.com/pattern/faq-pillars.html) Night pillars (https://patternpaste.com/pattern/faq-pillars.html#variant=night-pillars) Shot in Twenty Twenty-Five FAQ FAQ Standard ### FAQ plate An FAQ designed as an isolated focal plate. 9 blocks · 1 variation Open preview (https://patternpaste.com/pattern/faq-plate.html) Night plate (https://patternpaste.com/pattern/faq-plate.html#variant=night-plate)