Testimonial Block Component
The Testimonial component allows for the easy and attractive display of short user quotes with a variety of configuration options.
Testimonials can be displayed individually or shown as a carousel. Images are optional but recommended for the best display. Each testimonial can be hyperlinked.
When to use the Testimonial component
A testimonial consists of a person's written or spoken statement praising the virtue of an experience. Use this component to create a strong visual indicator for the display of short testimonial quotes with an optional image. Adding multiple testimonials to the same component will enable a sliding carousel.
Style Options
Style 1:
Style 2:
Style 3:
Style 3a:
Style 4:
Note: Styles 3 and 4 will appear the same on mobile devices.
Color Options
Carousel Options
Carousel functionality is automatically enabled when multiple testimonials have been entered into the same component.
Slide indicator arrows and dots can be disabled. Automatic advancement of the carousel can be enabled.
Slide order can be manually assigned but will display in the order they were created by default.
Show two slides side by side:
Usage Guidance
Testimonial content of no more than 100 words is recommended. An option to link the testimonial block is available if more content is required.
Citation images are optional but need to be at least 200 x 200 pixels. An image aspect ratio of 1 x 1 (perfect square) is recommended for best display.
More than one testimonial carousel per page is not recommended.
Implementation
- Open a page in Modern Campus CMS and enter editing mode.
- Place your cursor where you would like to place an image.
- From the toolbar, select the component icon , which resembles an atom symbol.
- From the list of components, select the Testimonial component.
- Fill in the required fields and select your options.
- To create a carousel of testimonials, click the "Add New Group" button within the component. Two or more testimonial groups are required to enable the carousel.
- Save and preview.