SR Cards Testimonial Slider 01
This module renders a heading, optional rich text description, and a slider of up to six individual testimonial cards on a plain background, each with an optional icon, a rich text quote, and an author name, title, and photo.
Pick it over sliders 02 and 03, which wrap all quotes inside one single bordered card, when you want each testimonial to appear as its own separate card with its own icon and photo. Choose it over 04 and 05 when you need up to six slides with full dot, arrow, and autoplay navigation controls rather than a fixed set of three slides or per-slide media and headings.
Use cases
- Customer quote carousel
- Case study testimonial slider
- Client review cards with photos
- Six-slide testimonial rotation
- Product feedback quotes with author photos
- Icon-accented client testimonials
Where it fits
- Included with: Free
- Page sections: Testimonials, Proof, Content
Editable fields
Content tab
| Field | Type | Notes |
|---|---|---|
| Background Video | File | Repeats: min 0, default 1. Add multiple file formats in order to provide compatibility with a broad range of browsers. |
| Background Video Tablet | File | Repeats: min 0, default 1. This background video will only be used on tablet devices. |
| Background Video Mobile | File | Repeats: min 0, default 1. This background video will only be used on mobile devices. |
| Enabled | Boolean | |
| ID | Text | Assign a ID to the module. |
| Class | Text | Assign a CLASS to the module. |
| Description | Rich text | |
| Lead Text | Boolean | Turn on to make the Description text larger. |
| Dots | Boolean | |
| Arrows | Boolean | |
| Autoplay | Boolean | |
| Autoplay Speed | Number | In seconds. |
Heading Repeats: min 0, default 1.
| Field | Type | Notes |
|---|---|---|
| Heading | Text | |
| Size | Choice | HTML heading size. Options: H1, H2, H3, H4, H5, H6, P. |
| Display Size | Choice | Size that heading is displayed at. 12 options, including Auto, H1, H2. |
| Color | Choice | 15 options, including Auto, Primary, Secondary. |
| Color | Color | |
| Align | Choice | Options: Auto, Left, Center, Right. |
| CSS Class | Text |
Slides Repeats: min 1, default 6.
| Field | Type | Notes |
|---|---|---|
| Slide Content | Rich text | |
| Slide Author Image | Image | Recommended Minimum Size: 120x120px. |
| Slide Author Name | Text | |
| Slide Author Title | Text |
Slides › Icon
| Field | Type | Notes |
|---|---|---|
| Icon Type | Choice | Options: Icon, SVG, None. |
| Icon | Icon | |
| SVG | Text | |
| Color | Color | |
| Purpose | Choice | The purpose of the icon, used for accessibility. If set to decorative, an additional attribute of aria-hidden="true" will be added to the icon. Options: Decorative, Semantic. |
Style tab
Change log
| Version | Change |
|---|---|
| 4.0.1 | minor CSS fixes |
| 4.0.0 | Stardust update |
| 3.3.0 | Accessibility improvements |
| 3.2.0 | Added responsive background options |
| 3.1.1 | Included slider styles dependecies |
| 3.1.0 | Added slider style fields |
| 3.0.0 | Added card style fields |
SR Cards Testimonial Grid 02
This module renders an optional heading and description above a grid of three testimonial cards, each showing a team photo, quote text, name, title, and an optional CTA button below the grid.
SR Cards Testimonial Slider 02
This module renders a single bordered card holding a slider of three testimonial slides, each with an icon or svg mark, a rich text quote, and an author image, name, and title.