How to Add Testimonials Effect in Bricks Builder with BricksFly

BricksFly Testimonials Element lets you display customer feedback in a customizable slider. You can choose a preset style, add testimonial details, adjust image sizes, and control slider navigation, autoplay, spacing, speed, and direction.

Requirement 

Make sure you have installed:

• Bricks Theme 
• BricksFly Pro

Activate Testimonials In BricksFly

1. Go to your WordPress Dashboard. 
2. Click on BricksFly. 
3. Head to the Elements tab. 
4. Under General, toggle on Testimonials.

Step 1: Set Up the Testimonials Element

First, click the + icon to add an element, then type Testimonials in the search field. Once the element appears, select it and drag it into the Bricks Builder editor.

In this example, a container inside the Testimonials section is selected from the Structure panel. The Testimonials element is then added inside that container.

You can place the element anywhere based on your layout needs.

Testimonials Style

Testimonials Style setting lets you choose the overall design and layout of the Testimonials Element. Available styles include One, Two, Three, and other preset options.

Each style changes how the testimonial content is displayed, including the image, text, name, rating, and navigation controls.

Changing the style only updates the design. Your testimonial content will remain unchanged.

Preview the available styles and choose the one that fits your website design. In this example, Three is selected.

Step 2: Add and Manage Testimonial Items

Add and update testimonial items to control which customer details appear in the Testimonials element.

Testimonials

The Testimonials section contains the individual testimonials displayed in the Element.

Item 1, Item 2, and Item 3

Each item represents a separate customer testimonial. Open an item to add or edit the available information, such as the customer’s image, name, designation, and link.

You can edit existing items, remove unnecessary testimonials, or add more items based on your requirements.

In this example, designer, developer, and manager testimonials are added.

Step 3: Select the Testimonial Image Size

Choose the image size to control how the customer photo appears in the testimonial layout.

Image Size

The Image Size setting controls which WordPress image size is used for the customer’s image. The available options include Full, Thumbnail, Medium, and Large.

Full displays the image using its original uploaded dimensions. It provides the highest available quality but may increase the page size.

Thumbnail displays the smallest generated version of the image. It is suitable for small customer profile images.

Medium displays a medium-sized version of the image and provides a balance between quality and file size.

Large displays a larger version of the image. It is suitable when the customer image is displayed prominently in the testimonial layout.

In this example, Full is selected as the image size. You can choose any available size based on your design needs.

Step 4: Configure the Testimonial Slider

Configure the slider options to control testimonial display, autoplay behavior, navigation, spacing, transition speed, and movement direction.

Slider Options

Use the Slider Options to control how the testimonials move, respond to user interaction, and appear within the slider.

Slides to Show

Controls how many testimonial slides are displayed at the same time. Setting the value to 1 displays one testimonial at a time, while setting it to 3 displays three testimonials at once.

In this example, Slides to Show is set to 1.

You can also use the responsive controls to set different values for desktop, tablet, and mobile devices.

Autoplay

Automatically moves the slider from one testimonial to the next without requiring visitors to use the navigation controls.

Disable this option when you want visitors to control the slider manually.

Autoplay Delay (ms)

Controls how long each testimonial remains visible before the slider moves to the next one automatically.

The value is measured in milliseconds. For example, setting the value to 3000 creates a three-second delay between slides.

Pause on Interaction

Controls whether autoplay pauses after a visitor interacts with the slider, such as by clicking an arrow, dragging a slide, or swiping on a touchscreen.

Enable this option to give visitors more time to read and control the testimonials after interacting with the slider.

Allow Touch Move

Allows visitors to drag or swipe between testimonial slides using a mouse, trackpad, or touchscreen.

Disable this option when you want the slider to move only through autoplay or navigation arrows.

Loop

Allows the testimonial slides to repeat continuously.

When enabled, the slider returns to the first testimonial after reaching the last one. When disabled, the slider stops after reaching the final testimonial.

Animation Speed (ms)

Controls how long the transition between testimonial slides takes.

The value is measured in milliseconds. A lower value creates a faster transition, while a higher value creates a slower transition.

In this example, the value is set to 500. You can adjust this value based on your preference.

Space Between (px)

Controls the horizontal space between testimonial slides.

Increase the value to add more space between testimonial cards, or decrease it to place them closer together.

In this example, the Space Between value is set to 20. You can adjust this value based on your design needs.

Navigation

Controls the testimonial navigation options, allowing visitors to move through the testimonials manually.

Available options include Arrows and Dots, Arrows, Dots, and None.

Select None if you do not want to display navigation controls. In this example, Arrows is selected.

Previous Arrow Icon

Allows you to select the icon used for the previous navigation button. Visitors can click this icon to view the previous testimonial. In this example, the option is left unchanged.

Next Arrow Icon

Allows you to select the icon used for the next navigation button. Visitors can click this icon to view the next testimonial. In this example, no custom icon is selected for this option.

Direction

Controls the direction in which the testimonial slider moves. You can choose a direction that matches your website layout and content flow, such as left to right or right to left. In this example, Left is selected.

Final Result