Configuring the testimonial widget

Choosing a template

Opinafy offers over 80 widget templates organized by style and use case.

Template types

• Classic: Clean, professional designs for any industry.
• Modern: With gradients, shadows, and contemporary visual effects.
• Minimalist: For websites that prioritize simplicity.
• Creative: 15 templates with unique and eye-catching designs.
• Dark: Perfect for websites with dark backgrounds.

You can preview all templates at opinafy.com/en/templates before choosing.

Customizing colors and typography

Each template is fully customizable to match your brand identity.

Customization options

• Background color: Of the widget container.
• Card color: Of each individual testimonial card.
• Text color: Of the name, content, and metadata.
• Star color: Customize the color of the ratings.
• Accent color: For borders, badges, and decorative elements.
• Typography: Choose from hundreds of Google Fonts. The widget loads them automatically.
• Border radius: Adjust the roundness of the cards.
• Shadows: Enable or disable card shadows.

The 7 available layouts

Choose the layout that best fits your website and available space:

1. Carousel

Displays testimonials in a horizontal carousel with arrow navigation or autoplay. Ideal for narrow sections or showing many testimonials without taking vertical space.

2. Grid

Displays testimonials in a responsive grid. Automatically adapts to available width (1, 2, or 3 columns). Ideal for dedicated testimonial pages.

3. Wall (Masonry)

Pinterest-style design where testimonials are organized in variable-height columns. Each card takes its natural content height. Ideal for showing testimonials of different lengths.

4. Single

Shows one testimonial at a time with a smooth transition between them. Ideal for hero sections or sidebars where space is limited.

5. Badge

A compact badge-style widget that shows the average rating and number of testimonials. Perfect for placing in headers, next to your logo, or as trust buttons.

6. Popup FOMO

Shows testimonials as popup notifications in the bottom corner of the screen. They appear periodically to create urgency and social proof. Ideal for ecommerce and conversion landing pages.

7. Marquee

Testimonials scroll horizontally continuously, like a news ticker. Ideal for client logo sections or as a trust banner.

Embed code (one line)

Installing the widget on your website is as easy as copying and pasting one line of code:

<div data-opinafy="your-project-slug" data-template="template-name"></div>
<script src="https://opinafy.com/widget.js" async></script>

That is it. The widget loads automatically, fetches your approved testimonials, and displays them with the template you chose.

Smart Tags (data attributes)

You can customize the widget behavior using HTML attributes:

• data-opinafy="slug" - Your project slug (required).
• data-template="name" - The template to use.
• data-layout="carousel|grid|wall|single|badge|popup|marquee" - The layout.
• data-limit="10" - Maximum number of testimonials to show.
• data-min-rating="4" - Only testimonials with minimum rating.
• data-tags="vip,premium" - Filter by tags.
• data-autoplay="true" - Autoplay for carousel/single.
• data-speed="5000" - Autoplay speed in milliseconds.

Video display modes

If your testimonials include video, you can choose how they are displayed:

• Inline: The video plays within the testimonial card.
• Modal: Clicking opens the video in a full-screen modal.
• Thumbnail: A thumbnail is shown and clicking plays the video.

Live preview

From the dashboard, you can preview the widget before installing it on your website.

1. Go to Projects > Your project > Widget.
2. Select template, layout, and customize colors.
3. The preview updates in real time as you make changes.
4. When satisfied, copy the embed code.

The preview shows exactly how the widget will look on your website, including real testimonials from your project.