Testimonials

It’s a well known fact that building a brand is not an easy thing nor can be done solely. Words from anyone’s mouth can spread faster than any contagious virus on the earth and you should know how to use them wisely in brand marketing.

Testimonial is a social proof of how your brand in real life, useful or useless. And using these good words from customers themselves is a best marketing strategy ever been implemented.

Pro tip
Testimonials significantly contributes to the online product purchases, more effective than analyst reports.

Configuration for Testimonials

Just ask for it to the loyal customers of yours, that’s it !

Table Of Contents

Setting up

Gutenberg gives multiple ways to add Testimonials into the content building area or we say playground. Check for the “+” icon in the top toolbar or click the “+” icon in the content area or start typing Testimonials after “/” sign, eg.“/Testimonials”, in the content area. Gutenberg also provides drag & drop after opening the list of widgets panel.

After placing the widget you’ll see three tabs on the right editing panel containing “Layout”, “Style” and “Advanced”. Go and start with the Layout tab.

1. Layout

Content

Select Style

Select your preferred layout for testimonials here.

Alignment

Alignment of component into left or right direction.

Testimonials

A repeater field to add the content of testimonials and authors.

Author Title

An input field to add the testimonial author name.

Author Designation

What author does for living ?

Testimonial Content

A main course, what author says about you in words !

Testimonial Title

Author’s expressions for you.

Author Image

How author looks like.

Connection

Unique Carousel ID

Add Unique ID for your carousel to connect it with our another widget Anything Carousel Remote.

2. Style

The Style tab is used for customising the appearance of all the Testimonials widget components. All these styling options include customising the fonts, colors, background, margins and padding which are common across all the widgets. So, we have created a single detailed article explaining these Styling Options.

View The Style Tab Article

Author Title

Typography

Assign size, weight, spacing and much more to fonts.

Color

A color picker to assign suitable color to the text.

Author Designation

Typography

Assign size, weight, spacing and much more to fonts.

Color

A color picker to assign suitable color to the text.

Image Style

Max Width

Set the maximum possible horizontal expansion for image. Height will be matched accordingly.

Border Radius

Set the radius curve of the image’s corner.

Box Shadow

Give Box/Text/Drop shadow effect and color to an element.

Testimonial Title

Typography

Assign size, weight, spacing and much more to fonts.

Color

A color picker to assign suitable color to the icon.

Content

Typography

Assign size, weight, spacing and much more to fonts.

Color

A color picker to assign suitable color to the icon.

Content Background

Margin

Put-in some outer space to an element.

Padding

Put-in some inner space to an element.

Border Radius

Set the radius curve of the element’s corner.

Background

Apply suitable background like color/ gradient to an element.

Box Shadow

Give Box/Text/Drop shadow effect and color to an element.

Carousal Options

Slider Mode

Select slide direction of slider from here.

Slide Speed

Slider speed in milliseconds.

Columns

Select how many columns you want to have per slide.

Default Slide Active

Select the first slide to display on slider load.

Next Previous

Select if you want to rotate all rows at once or not.

Columns Gap

Put in some space between columns.

Draggable

If slider is draggable, then you can drag any slide to side and see the next one without using arrows for navigation.

Infinite Mode

If slider is in infinite mode, slider will repeat it self after last slide.

Pause on Hover

Slider will stop sliding on mouse hover.

Adaptive Height

Slider will adapt the height according to the current slide’s height instead of fixed height.

Auto play

If auto play is enabled, slider will be in play state when page load is completed.

Auto play Speed

Slide shifting time for auto play.

Show Dots

Select if you want dots / slide count or not.

Dots style ⭐

Select dots / slider counter style from here.

Background Color

A color picker to assign suitable color to the background.

Active Background Color

A color picker to assign suitable color to the currently active slide’s background.

Dots Top Margin

Apply space from top in root container from here.

On Hover Dots ⭐

Show dots only on hover.

Show Arrows

Show arrows / slider navigator or not.

Arrows Style ⭐

Select arrows / slider navigator’s style from here.

Background Color

A color picker to assign suitable color to the background of arrows.

Icon Color

A color picker to assign suitable color to the icons of arrows.

Hover Background Color

A color picker to assign suitable color to the background of arrows on hover.

Hover Icon Color

A color picker to assign suitable color to the icons of arrows on hover.

Outer Arrows

Place arrows outside it’s root container or not.

on Hover Arrows ⭐

Show arrows only on hover.

Centre Mode

Centre mode enables active slide to be shown as visually centre or in braced up mode.

Centre Padding ⭐

Put-in some inner space to centred slide.

Centre Slide Effect ⭐

Choose how you want to make look centre slide different from others.

Scale ⭐

Choosing scale would make centre slide look bigger than others. Choose scale for centre & normal slides from below options.

Shadow ⭐

Choosing shadow would create shadow effect on centre slide different than others. Apply custom shadow from below option provided.

Normal Slide Opacity ⭐

Apply opacity / transparency for normal slide from here.

Number of Rows ⭐

Select how many rows you want to have per slide.

3. Advanced

Advanced Tab Options are common across all the widgets. So, we have written a detailed tutorial explaining how to use these options.

View The Advanced Tab Tutorial

Note : ⭐ Symbol as a suffix displays a Pro feature field.
Was this article helpful?
0 out of 5 stars
5 Stars 0%
4 Stars 0%
3 Stars 0%
2 Stars 0%
1 Stars 0%
How can we improve this article?