Skip to main content

Text Expander

An inline read-more / reveal toggle — hide part of a sentence or paragraph behind a Show More button. Tabs: Content, Layout, Styling, Animations, Advanced.

Content

Visible Content, Hidden Content, Button Text (Show) (default "Show More"), Button Text (Hide) (default "Show Less").

Layout

OptionChoices
"Show More" Button LocationImage-picker of placements
"Show Less" Button LocationImage-picker of placements
Merge Boundary ParagraphsOn/Off
Show Ellipsis When CollapsedOn/Off
Word/Character CountNone, Word count, Character count
Click-Anywhere to ExpandOn/Off
Use Native <details>On/Off (semantic HTML disclosure)

Styling

OptionChoices
Toggle IconNone, Chevron (rotates), Plus / Minus
Initially OpenOn/Off
ColorsVisible/Hidden content, Show More/Less buttons (custom hex/rgba)

:::note Screenshots — toggle icons & states Capture the collapsed/expanded states and toggle icons: text-expander-collapsed, text-expander-expanded, text-expander-chevron. :::

Screenshots

note

Drop screenshots into static/img/shortcodes/ and embed them here.