Read More shows the beginning of a long text — up to a height you choose — and a View More button. Clicking the button reveals the rest; a View Less button folds it back. It keeps long articles, policies or descriptions from dominating the page while leaving them one click away.

What it is for

Use it for content that must be on the page in full (for legal or search reasons) but that most visitors will only skim: a detailed programme, a long “about” text, terms, methodology notes. Several Read More blocks can follow each other, each with its own title.

See it live on the example page APB Read More.

Structure

• The Read More component carries the shared settings (section title, width, placement, container).
• Read More Items — one per collapsible text. Each item decides its own collapsed height, button labels and color, so one component can hold several blocks with different settings.

Component settings

Setting	Options	Default	What it does
Section Title / Show Section Title	text; No / Yes	— / No	See Section Title and Intro Text. This component has no Intro Text; use the item Body instead.
Target Placement	Body, Main Content Top/Bottom, Top region, Sidebars, Internal Placement 1–3	Body	See Target Placement.
Component Width	25% … 100%	100%	See Component Width.
Custom Class / Access Control	—	—	See Advanced settings.
Container Settings	—	32px bottom margin	See Container Settings.

Read More Item fields

Field	Required	What it does
Title	yes	Heading of the block; displayed only when Show Title is Yes (it is always used in the editor).
Show Title	yes (No)	Whether the Title appears above the text.
Body	yes	The full text (rich text).
Collapsed Height	yes (200px)	0px … 400px in 50px steps: how much of the Body is visible before the button. 0px hides the whole text behind the button. If the text is shorter than this height, no buttons are shown and the text appears in full.
Color Style	yes (Blue)	Color of the buttons (second palette: Blue, Blue and Green, Gray, Green, Orange, Red, Teal Blue, Yellow). See Color Style.
More Link Text / Less Link Text	yes	Labels of the two buttons (default “View More” / “View Less”). Translate or adapt them: “Show full programme”, “Hide”.
Description (internal) / Custom Class	no	Editor note (never shown) / extra CSS class.

How to use it

1. Click Add Read More and set a Section Title.
2. Click Add new Read More Item. Paste or write the full text in Body.
3. Pick a Collapsed Height that ends after the first paragraph or two — enough to show what the text is about.
4. Adjust the button labels and color, then click Create.
5. Save and test: the text should fade out at the chosen height and expand on click.

Tips

• Choose the collapsed height so the cut does not fall in the middle of an image or a heading.
• For several independent sections with titles, an Accordion is often clearer than a stack of Read More blocks.
• Search engines and screen readers see the complete text; Read More only changes what is visible.

For site builders

Item	Value
Module	apb_pb_read_more
Paragraph types	apb_pb_read_more, apb_pi_read_more
Requires	apbuilder, Paragraphs, Entity Reference Revisions, Inline Entity Form, Field Group, Entity Access by Role Field, core Options / Taxonomy / Text
Own vocabulary	apb_tax_rm_cpsd_height (0px … 400px)
Shared vocabularies	apb_tax_cs_02 (per item), apb_tax_width, apb_tax_target_placement
Front-end	apb_pb_read_more/frontend: collapse/expand from data-apb-*; button colors injected as inline CSS per item.
Container settings	Full profile.
Example page	/apbuilder_examples/apb-read-more