Fancy Testimonial

How to use Fancy Testimonial Widget of Sky Addons for Elementor

Fancy Testimonial shows one customer quote at a time in Elementor, surrounded by the faces of everyone else who left one. Instead of a plain slider with a single photo, your visitors see a crowd of real customers — and clicking any face brings up that person’s testimonial. You can lay the faces out along a curved path above the quote, or as a tidy wall of avatars with one featured review underneath. Testimonials can be typed in by hand or pulled automatically from your posts. This documentation will guide you through the process of using the Fancy Testimonial Widget to turn a list of quotes into social proof people actually look at.

Features:

1. Two Ready-Made Layouts: Wave Path lines the faces up along a curve above the quote; Cluster Wall arranges them in a neat staggered grid with one featured testimonial below.
2. Click Any Face: Every avatar is a button. Visitors click a face and jump straight to that person’s testimonial, so they can pick who they want to hear from.
3. Type Them In or Pull Them In: Write testimonials by hand, or point the widget at your posts and let it build the list for you — title, category, excerpt and featured image become the name, designation, quote and photo.
4. Automatic Read More: Long testimonials are trimmed to a word count you choose and get a small link that expands them, so one wordy customer never makes the whole section tall.
5. Star Ratings: Each testimonial can carry its own rating, and half stars are supported — 4.5 shows as four and a half, not five.
6. Autoplay With Pause On Hover: The quotes rotate on their own and stop the moment someone hovers, so nobody loses their place mid-sentence.
7. Adapts To Small Screens: The wall drops to fewer columns and the featured testimonial stacks under its photo on phones, without you setting anything up.

Insert Fancy Testimonial Widget

1. Search for Fancy Testimonial in the Elementor widget panel on the left.
2. Drag and drop the widget onto your page where you want the testimonials to appear.

Add Your Testimonials

Open the Testimonials section. The Source option decides where the quotes come from:

1. Default Repeater: You type the testimonials in yourself. Click an item to open it and fill in Author Image, Name, Designation (job title or company), the Testimonial text, and a Rating from 0 to 5. Use the ADD ITEM button for each new person.
2. Dynamic Posts: The widget builds the list from your posts instead. The post title becomes the name, its first category becomes the designation, the excerpt becomes the testimonial, and the featured image becomes the photo. Choose which posts in the Query section that appears. If you store a rating in a custom field, type that field’s name into Rating Custom Field and it will be used; leave it empty and every testimonial shows five stars.

Every text field here also accepts Elementor’s dynamic tags, so you can pull a name, a quote or a rating from a custom field instead of typing it.

Choose a Layout

The Layout section is where you pick the look. Options change depending on which layout you choose, so you only ever see the settings that apply.

1. Layout: Pick Wave Path for a row of faces riding a curve above the quote, or Cluster Wall for a grid of faces above one featured testimonial.
2. Avatar Size: How big the faces are. Set a different size for tablet and mobile using the device icons next to the label.
3. Avatars Per View (Wave Path): How many faces are visible at once along the curve — 7 on desktop, 5 on tablet and 3 on mobile works well.
4. Wave Depth (Wave Path): How far the faces rise and fall along the curve. Lower it for a gentle ripple, raise it for a dramatic swoop.
5. Show Path Line (Wave Path): Turns the dotted line and its small marker dots on or off.
6. Featured Avatar Size (Cluster Wall): The size of the large photo next to the featured testimonial.
7. Wall Columns (Cluster Wall): How many faces per row. Only even numbers are offered, because every second column is what creates the staggered pattern — an odd number would turn those neat rows into a diagonal.
8. Column Stagger (Cluster Wall): How far every second column drops. Set it to 0 for a perfectly flat grid.
9. Wall Spacing (Cluster Wall): The gap between the faces.
10. Featured Alignment (Cluster Wall): Whether the featured testimonial sits left, centered or right. Centering also tucks the quote marks into the text instead of hanging them off the side, which is what you want once the layout stacks on a phone.
11. Show Quote Icon, Show Rating, Show Navigation: Turn the quote marks, the stars and the previous/next arrows on or off.
12. Testimonial Length (words): Anything longer than this is trimmed and given a link that expands it. Set it to 0 to always show the full text.
13. Read More Label and Read Less Label: The wording of that link. Change it to whatever suits your site.

Configure Settings

Open the Slider Settings section to control how the testimonials move.

1. Autoplay: Rotates through the testimonials on its own.
2. Autoplay Speed (ms): How long each testimonial stays on screen. 5000 is five seconds — give long quotes more time.
3. Pause On Hover: Stops the rotation while someone’s cursor is over the widget, so they can finish reading.
4. Transition Speed (ms): How quickly one testimonial fades into the next.

Style Your Testimonials

Switch to the Style tab to match the widget to your brand. Each section handles one part of the design.

1. Testimonial Card:
   Background, padding, border, border radius and box shadow for the panel the quote sits on. Leave the background empty for text that floats on the page.
2. Testimonial Content:
   Colour and typography for the quote text, the name, the designation and the read more link, plus the quote icon colour and the star colour, unmarked star colour and star size.
3. Avatars:
   Border and border radius for the photos, plus Inactive Opacity to fade the faces that are not currently selected. Under Active you can set the Scale the selected face grows to, its Border Color, and the Glow Ring Color that marks it.
4. Navigation:
   Size, colour and background of the previous/next arrows, with separate settings for their hover state.

Keep the active glow in one of your brand colours — it is the only thing telling visitors which face they are reading, so it needs to stand out from the rest.

Save and Preview

1. Click the Publish or Update button to save your work.
2. Preview the page and click a few faces to check the right testimonial appears for each one.

Best Practices

1. Use real photos of real customers. The whole point of this widget is the crowd of faces, and stock photos undo that instantly.
2. Upload square photos, or ones where the face is centered. Every avatar is cropped to a circle, so an off-center subject loses their head.
3. Add enough testimonials to fill the layout. Cluster Wall looks best with a dozen or more faces; with three it looks empty.
4. Keep quotes to a couple of sentences and let Read More handle the long ones, so every testimonial takes up the same amount of space.
5. Check the widget on a phone before publishing. The layout adapts on its own, but you may want a smaller avatar size for mobile.

Troubleshooting

1. The faces look squashed or off-center: The photos are being cropped to circles. Re-upload them as squares, or pick images where the face sits in the middle.
2. Nothing appears after choosing Dynamic Posts: The query is not matching anything. Open the Query section and check the source, post type and any category or tag filters you set.
3. Testimonials from posts have no photos: Those posts have no featured image. Set one on each post, or switch back to the Default Repeater and upload the photos yourself.
4. The wall rows look crooked rather than evenly stepped: The stagger is too close to the spacing. Increase Wall Spacing or reduce Column Stagger so the two numbers differ clearly.
5. Every testimonial shows five stars: With Dynamic Posts, ratings come from a custom field. Type the field name into Rating Custom Field, or turn Show Rating off.

Conclusion

The Fancy Testimonial widget turns a plain list of quotes into something visitors want to explore — a wall of real faces they can click through at their own pace. Set it up once, and adding a new customer is a matter of dropping in a photo and a sentence. If you get stuck or need a hand with your setup, our support team is always happy to help.