{"id":67,"date":"2026-02-11T16:16:55","date_gmt":"2026-02-11T16:16:55","guid":{"rendered":"https:\/\/teton.wwwdev.uwosh.edu\/web\/?page_id=67"},"modified":"2026-02-18T19:41:30","modified_gmt":"2026-02-18T19:41:30","slug":"testimonial-cards-block","status":"publish","type":"page","link":"https:\/\/teton.wwwdev.uwosh.edu\/web\/cms-guide\/testimonial-cards-block\/","title":{"rendered":"Testimonial Cards Block"},"content":{"rendered":"\n
\n \n\n
\n \n\n

Testimonial Cards Block<\/h1>\n\n\n\n
\n
Return to CMS Guide<\/a><\/div>\n<\/div>\n\n<\/div>\n\n\n\n
\"placeholder<\/figure>\n\n<\/section>\n\n\n\n
\n \n\n

The Testimonial Cards block was primarily designed for use on the homepage, but can be used on other pages if desired. It creates a visual and interactive way to present testimonial content. The block contains a heading, intro text, an optional call to action, and testimonial cards items. Each testimonial cards item contains an image, a heading, and a call to action. When the block is first placed on the page, only one testimonial cards item exists. This can be duplicated as needed for the desired number of cards.<\/p>\n\n\n\n

This block must be followed immediately by the Testimonials block<\/em>. The same number of testimonials items need to be created to match the number of testimonial cards items. The system then connects the content in the two blocks when it is displayed on the published page. When a user clicks on a testimonial cards item, the associated testimonial will appear in a modal window. Explore the functional example below for more details.<\/p>\n\n<\/div>\n\n\n\n

\n \n\n
\n \n\n

Testimonial Cards Example<\/h2>\n\n\n\n

This intro text is used to provide details and context for the testimonial cards. Best practice is to limit this text to 1-3 sentences.<\/p>\n\n<\/div>\n\n\n\n

\n
\n
\n \n\n
\n \n\n
\"placeholder<\/figure>\n\n\n\n
\n \n\n

Testimonial Cards Item<\/h3>\n\n\n\n
\n
Call to Action<\/a><\/div>\n<\/div>\n\n<\/div>\n\n <\/a>\n<\/div>\n\n\n\n
\n \n\n
\"placeholder<\/figure>\n\n\n\n
\n \n\n

Lorem Ipsum Dolor sit Amet Consectetur<\/h3>\n\n\n\n
\n
Call to Action<\/a><\/div>\n<\/div>\n\n<\/div>\n\n <\/a>\n<\/div>\n\n\n\n
\n \n\n
\"placeholder<\/figure>\n\n\n\n
\n \n\n

Cras Sagittis Augue non arcu Aliquam<\/h3>\n\n\n\n
\n
Call to Action<\/a><\/div>\n<\/div>\n\n<\/div>\n\n <\/a>\n<\/div>\n\n <\/div>\n
\n
<\/div>\n