# Collapse the Shopware product description: read more, free

> Free Shopware 6.7 plugin: collapse long product descriptions with cut, fade-out and read-more button.

Quelle / Source: https://stoneandwater.online/en/read-more.html

# Collapse the product description in Shopware: Read More - collapsible description.

Elegantly collapse long product descriptions - SEO-safe, A11y-compliant, free.
[View manual](https://stoneandwater.online/en/manual-read-more.html)

What the plugin does New

## Collapsible *product description*.

Long product descriptions are mandatory for SEO but bad for UX - customers see a wall of text and scroll past. The plugin solves this with a collapsible region without hiding anything from the SEO bot. **Free.**

Read more toggle

### Cut + fade + button

Long product descriptions are cut at a configurable pixel height, with fade-out gradient and "Read more" button - one click reveals the full text.

SEO-safe

### Text stays in the DOM

Content is hidden via CSS `max-height`, not removed from the DOM. Google sees the full text - no ranking loss.

3 button styles

### Link, outline, solid

Text link, outline button or solid button - fits any theme. Alignment left, centre or right.

Per viewport

### Mobile, tablet, desktop

Toggle per breakpoint - e.g. active only on mobile, fully expanded on desktop.

Properties table

### Optionally collapse along

The properties table (size, material etc.) is moved into the collapsible area via JavaScript and folded in and out with it - when enabled.

A11y & state

### Accessible + sessionStorage

`aria-expanded`, keyboard navigation, visible focus ring. Optionally remember state per session - once expanded, stays expanded on further pages.

Why it works

## Better UX, *full visibility*.

Long descriptions are a classic tension between SEO and UX. The plugin solves both sides.

Exactly one plugin · exactly one job

### Elegantly collapse long descriptions - nothing else.

Unlike "jack-of-all-trades" plugins that do ten things half-well, this one solves a single task properly: long product descriptions are presented with a configurable cut, fade-out gradient and toggle button - so the detail page stays short and tidy without losing actual content.

Conversion

### Less wall-of-text

Shorter-looking detail pages reduce bounce rate especially on mobile, where long copy is particularly off-putting.

SEO

### No hidden content

Google penalises *display:none* tricks for important content. We hide only via CSS - crawlers see the full text.

Accessibility

### WCAG-compliant

`aria-expanded` for screen readers, visible focus, keyboard support via Enter/Space. No A11y audit issue.

Configuration

## Fully in the *Shopware admin*.

All settings under Extensions Stone & Water - Collapsible Product Description Configure. No code changes required.

Max height

### 320 px default, adjustable

Cut-off height in pixels. Toggle is only shown above this height - short texts are left untouched.

Min overflow

### 80 px default

Prevents annoying toggles on texts that are only a few pixels too long. Collapse only kicks in above this overflow.

Fade gradient

### Height + colour configurable

80 px gradient at the bottom, end colour freely selectable (match your theme background). Optionally disabled.

Button colour

### Theme accent

Colour picker in the admin - matches your brand scheme. Default: indigo `#4f46e5`.

Extra selectors

### Include via CSS selectors

Additional elements (e.g. `.product-detail-delivery`) can be included in the collapsible area via CSS selector.

Session storage

### State per session

Optionally enable: once the user clicks "Read more", further product pages stay automatically expanded.

Technical details

## Clean *Shopware integration*.

Pre-built JS bundle, Twig override on the correct block, no core patch. Installation via Plugin Manager.

### Compatibility

Shopware 6.6 & 6.7 Shopware 6.6 PHP 8.2+

### Integration

Twig override on `@Storefront/storefront/component/product/description.html.twig`, block `component_product_description_content_text`. Important: not the deprecated file under `page/product-detail/`.

### PHP subscriber

`ProductPageLoadedEvent` injects the plugin config as a page extension `stawReadMore`. Twig reads it and sets CSS variables.

### JS bundle

Pre-built IIFE bundle at `dist/storefront/js/staw-read-more/staw-read-more.js`. No `bin/build-storefront.sh` required.

### CSS variables

`--staw-rm-max-height`, `--staw-rm-fade-height`, `--staw-rm-fade-color`, `--staw-rm-button-color` - custom theming possible without plugin patch.

### ResizeObserver

Works even when the description is inside a closed tab/accordion - once visible, height is re-evaluated automatically.

### Availability

**Free.** No ongoing costs.

Availability

## Through the store or *directly from us*.

Two routes, the same feature set - pick whichever suits your setup.

Directly from Stone & Water

### Available right now

Free
permanently, no running costs

Download the free Plugin Suite and upload it in the admin, no SSH needed. It installs and updates the plugin with one click. You buy the licence directly from us, with an invoice from us and support straight from the developer.
[Download Plugin Suite](https://stoneandwater.online/en/plugin-suite.html)[+49 2555 9997342](tel:+4925559997342)

Shopware Store

### In preparation

The plugin will be listed in the official Shopware Community Store. Installation and automatic updates then run through the plugin manager, billing through your Shopware account. We will link it here as soon as it is live.

FAQ

## Read More FAQ

#### How do I collapse the product description in Shopware?

Read More limits the description to an adjustable height, 320 pixels by default, with a soft fade and a read more button. One click shows the full text.

#### Does collapsing hurt SEO?

No. The text is not removed from the document but hidden with CSS max-height. Search engines see the complete product description.

#### When does the button appear?

Only when the text exceeds the maximum height by the minimum overflow, 80 pixels by default. With 320 plus 80 pixels, text is only collapsed from a height of 400 pixels.

#### Can I collapse only on phones?

Yes. With the mobile only option, collapsing only applies below 768 pixels width, and the description stays open on desktop.

#### Is Read More accessible?

The toggle reports its state via aria-expanded, works with the keyboard and has a visible focus ring.

#### What does Read More cost?

Nothing. The plugin is free with no running costs, for Shopware 6.7 and 6.6.

Better product detail pages?

## Completely *free*.

Read More for Shopware 6.7 - SEO-safe, A11y-compliant, fully configurable in the admin. Ready to use - with no ongoing costs.
[Get it with the Plugin Suite](https://stoneandwater.online/en/plugin-suite.html)[Request setup](https://stoneandwater.online/en/contact.html)
