Testimonials for YOOtheme Pro

TESTIMONIALS is a builder element for YOOtheme Pro on Joomla 5 and 6 that puts customer testimonials in motion. You drag it into a row, add your entries and pick one of two layouts: an endless marquee or a slideshow that shows one testimonial after another. A second element, the single testimonial, can also be placed in any column outside the marquee. It comes with 77 settings plus a field for custom CSS. Stylesheet and script only load on pages that contain the element.

Marquee: lanes, direction, speed

The marquee runs horizontally in rows or vertically in columns, in one to four lanes. Your entries are distributed in turn, and every second lane can run in the opposite direction. You set the speed in pixels per second, between 5 and 400 - it stays the same no matter how many entries a lane holds. You also control the gap, item width, lane height and a soft fade at the edges. The script fills each lane on its own so no gap appears, and it recalculates when the window is resized.

Showcase: one testimonial after another

The second layout shows one testimonial at a large size, with an oversized position number in the background that can follow the mouse, and a rotated label on the left edge. The progress indicator can sit vertically next to the label or horizontally above or below the slideshow. You can choose from five transitions, the interval ranges from one to thirty seconds, and an optional faded line with all company names runs below the slideshow. The quote builds up word by word as soon as a new testimonial appears.

What goes into an entry

For each testimonial you add an image, avatar, name, a meta line for job title or handle, the company, the quote, a rating from zero to five stars, a date and a link. Each of these fields can be bound to a dynamic source, such as Joomla articles or custom fields. You decide once on the Testimonials element how the parts are arranged: author block above or below the quote, company as a badge at the top, at the bottom or as a line in the author block, stars above or below the text, avatar next to or above the name. If an avatar image is missing, a circle of the same size with the initials takes its place, so all cards stay aligned.

Reference slider instead of quotes

Every entry takes an image that sits above or below the text and can be cropped to a shared height - with a focal point for the crop. Leave out the name and quote, and the same element becomes a reference or logo slider. Inside a card, the image runs edge to edge as card media. Because the container accepts any builder element, you can also drag images, text or buttons from YOOtheme straight into the lane; if you like, each of them gets the same card as the testimonials.

Cards and colors

You set the card style, card size and hover effect once for all entries, and each testimonial can override the color on its own - using the familiar styles of your theme. 17 color fields cover the name, quote, meta line, date, company badge with background and border, initials circle, accent, filled and empty stars, the number in the showcase and the pause button in all states. Left empty, each field inherits the color of your card or section, so the element matches your theme without a single setting.

Accessibility under the BFSG

Moving content is one of the points an audit under the German Accessibility Strengthening Act (BFSG), the German implementation of the European Accessibility Act, and EN 301 549 looks at. WCAG 2.2.2 requires a mechanism to pause motion that lasts longer than five seconds: the element provides a visible pause button with aria-pressed for this, placed in any of the four corners. The motion also stops on mouse hover and when keyboard focus is inside a lane. Anyone who has set reduced motion sees a calm list without animation and without autoplay. The copies that make the marquee look endless are hidden from screen readers and cannot be focused, every rating is read out as text, and the element can appear as a named region in the landmark structure.