Testimonial
Settings
| Setting | ID | Type | Default | Description |
|---|---|---|---|---|
| Block class | class | text | ||
| Quote | quote | richtext | <p>Add a short quote from a happy customer.</p> | |
| Author | author | text | Jane Doe | |
| Author subtitle | role | text | Verified buyer | |
| Avatar | avatar | image_picker | ||
| Rating | rating | range | 5 | Set to 0 to hide the stars. |
| Content order | card_layout | select | author_bottom | |
| Alignment | card_alignment | text_alignment | left | |
| Quote size (mobile) | quote_size_mob | select | text-base | |
| Quote size (desktop) | quote_size | select | text-base | |
| Quote color | quote_color | select | base-text | |
| Custom color | quote_color_custom | color_background | ||
| Author size (mobile) | author_size_mob | select | text-sm | |
| Author size (desktop) | author_size | select | text-sm | |
| Author color | author_color | select | base-text | |
| Custom color | author_color_custom | color_background | ||
| Subtitle size (mobile) | role_size_mob | select | text-xs | |
| Subtitle size (desktop) | role_size | select | text-xs | |
| Subtitle color | role_color | select | base-text | |
| Custom color | role_color_custom | color_background | ||
| Avatar size | avatar_size | range | 2.5 | Avatar width and height in rem (1 = 16px). |
| Avatar radius | avatar_radius | select | rounded-circle | Shape of the avatar image. |
| Rating size | rating_size | range | 1 | Star size in rem (1 = 16px). |
| Rating color (custom) | rating_color | color | ||
| Rating active color (custom) | rating_active_color | color | ||
| Card background | card_bg | color_background | Supports solid or gradient colors. | |
| Border width | card_border_width | range | 1 | |
| Border color | card_border_color | color | #e5e7eb | |
| Card radius | card_radius | select | rounded-md | |
| Shadow | card_shadow | select | none | |
| Padding | card_padding | range | 6 | Tailwind spacing scale 0-10 (1 = 4px, 10 = 40px). Uniform padding on all sides. |
| Hover effect | card_hover | select | none | |
| Hover shadow | card_hover_shadow | select | none | |
| Hover background | card_bg_hover | color_background | Applied on hover. Leave empty for no change. |
Option values
- Content order (
card_layout): Author on bottom (author_bottom), Author on top (author_top) - Quote size (mobile) (
quote_size_mob): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Quote size (desktop) (
quote_size): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Quote color (
quote_color): Primary (primary), Secondary (secondary), Success (success), Warning (warning), Danger (danger), Base text (base-text), Heading text (heading-text), Black (black), White (white), Gray 100 (gray-100), Gray 200 (gray-200), Gray 300 (gray-300), Gray 400 (gray-400), Gray 500 (gray-500), Gray 600 (gray-600), Gray 700 (gray-700), Gray 800 (gray-800), Gray 900 (gray-900), Random (random), Custom (custom) - Author size (mobile) (
author_size_mob): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Author size (desktop) (
author_size): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Author color (
author_color): Primary (primary), Secondary (secondary), Success (success), Warning (warning), Danger (danger), Base text (base-text), Heading text (heading-text), Black (black), White (white), Gray 100 (gray-100), Gray 200 (gray-200), Gray 300 (gray-300), Gray 400 (gray-400), Gray 500 (gray-500), Gray 600 (gray-600), Gray 700 (gray-700), Gray 800 (gray-800), Gray 900 (gray-900), Random (random), Custom (custom) - Subtitle size (mobile) (
role_size_mob): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Subtitle size (desktop) (
role_size): 3 Extra Small (text-3xs), 2 Extra Small (text-2xs), Extra Small (text-xs), Small (text-sm), Medium (text-base), Large (text-lg), Extra Large (text-xl), 2X Large (text-2xl), 3X Large (text-3xl), 4X Large (text-4xl), 5X Large (text-5xl), 6X Large (text-6xl), 7X Large (text-7xl), 8X Large (text-8xl), 9X Large (text-9xl) - Subtitle color (
role_color): Primary (primary), Secondary (secondary), Success (success), Warning (warning), Danger (danger), Base text (base-text), Heading text (heading-text), Black (black), White (white), Gray 100 (gray-100), Gray 200 (gray-200), Gray 300 (gray-300), Gray 400 (gray-400), Gray 500 (gray-500), Gray 600 (gray-600), Gray 700 (gray-700), Gray 800 (gray-800), Gray 900 (gray-900), Random (random), Custom (custom) - Avatar radius (
avatar_radius): Square (rounded-none), Rounded small (rounded-md), Rounded medium (rounded-xl), Rounded large (rounded-2xl), Rounded extra large (rounded-3xl), Squircle (rounded-squircle), Circle (rounded-circle), Pill (rounded-full), Rounded top (rounded-top), Rounded bottom (rounded-bottom), Single corner (rounded-corner), Diagonal corners (rounded-diagonal), Arch (rounded-arch), Dome (rounded-dome), Cylinder (rounded-cylinder), Barrel (rounded-barrel), Leaf pointed (rounded-leaf-point), Leaf (rounded-leaf), Lens (rounded-lens), Petal (rounded-petal), Egg (rounded-egg), Egg inverted (rounded-egg-inverted), Shield (rounded-shield), Drop (rounded-drop), Diamond (rounded-diamond), Blob (rounded-blob), Amoeba (rounded-amoeba), Flower (rounded-flower), Mountain (rounded-mountain), Pebble (rounded-pebble), Bean (rounded-bean), Cloud (rounded-cloud) - Card radius (
card_radius): Square (rounded-none), Rounded small (rounded-md), Rounded medium (rounded-xl), Rounded large (rounded-2xl), Rounded extra large (rounded-3xl), Squircle (rounded-squircle), Circle (rounded-circle), Pill (rounded-full), Rounded top (rounded-top), Rounded bottom (rounded-bottom), Single corner (rounded-corner), Diagonal corners (rounded-diagonal), Arch (rounded-arch), Dome (rounded-dome), Cylinder (rounded-cylinder), Barrel (rounded-barrel), Leaf pointed (rounded-leaf-point), Leaf (rounded-leaf), Lens (rounded-lens), Petal (rounded-petal), Egg (rounded-egg), Egg inverted (rounded-egg-inverted), Shield (rounded-shield), Drop (rounded-drop), Diamond (rounded-diamond), Blob (rounded-blob), Amoeba (rounded-amoeba), Flower (rounded-flower), Mountain (rounded-mountain), Pebble (rounded-pebble), Bean (rounded-bean), Cloud (rounded-cloud) - Shadow (
card_shadow): None (none), Small (sm), Medium (md), Large (lg) - Hover effect (
card_hover): None (none), Lift up (up), Lift down (down), Scale up (scale_up), Scale down (scale_down) - Hover shadow (
card_hover_shadow): None (none), Small (sm), Medium (md), Large (lg)
Presets
- Testimonial