The “Slider” UI element is used to present multiple contents in a space-saving and interactive way within the layout. Primarily, images can be displayed in sequence; alternatively or additionally, text-based content is also possible. The slider allows various contents to be displayed in rotation within a defined area, focusing attention without taking up extra space in the layout.[1]
Features & Benefits
- Presentation of multiple images or content groups as a rotating slider
- Automatic start and endless loop can be optionally enabled
- Individual margins for precise placement
- Flexible alignment and arrangement of content
- Integration of images and/or groups (e.g. additional paragraphs)
- Space-saving and attention-grabbing presentation
- Responsive adaptation to various screen sizes
Backend Configuration
Steps
- Create ContentType.
- Insert the “Slider” paragraph.
- Configure the slider with the desired settings and content.
Settings & Fields
| Field | Description |
|---|
SLIDER NAME | Internal label for better overview in edit mode |
Automatic Start | Slider starts automatically when the page loads |
Endless Loop | Slider runs in an endless loop |
Margin | Outer margin values (shorthand: top, right, bottom, left; e.g. 10px 8px 15px 7px) |
Images / Groups | Add images or content groups as slider elements |
General Configuration Options
| Field | Description |
|---|
Spacing Type | none | page width | page width with mobile spacing | window width |
Alignment | None/Standard | Left | Center | Right |
Vertical Alignment | None | Top (flex-start) | Bottom (flex-end) | Stretched (stretch) | Top | Center | Bottom |
Link | Target (_self, _blank), bonus number, anchor, highlight, search filter |
Tracking | Campaign ID, type, category, detail, name |
Tooltip | Activate/deactivate tooltip, position, promotion text or content snippet |
Personalization | Display for specific user groups (anonymous, logged-in customers, bonus program, credit affinity) |
Accessibility | Activate skip link, freely nameable |
Replace Content | Content can be dynamically replaced using Dynamic Yield ID |
Time Control | Control visibility of the slider by time (from/until) |
- Collapse: Collapse section
- Add above: Add new section above
- Remove: Delete section
- Duplicate: Duplicate section
- Add to library: Save section as template
