Table of Contents
In this WPDesigns guide, we will learn how to add, edit and delete testimonials in Elementor. A testimonial is a truthful and positive review of your product, service, or business. The client has already purchased from you and has written you a positive message of appreciation. When you publish a testimonial on your website, it becomes publicly available. Anyone considering making a purchase or deal should read it and assess its importance.
You can use the Testimonial Carousel widget to create a sliding carousel of consumer testimonials in a variety of styles. To add the testimonial carousel widget search for testimonial carousel in the Elementor widget search bar. Then, just drag and drop it on the page. After that, you will get a premade default slider. You will get three kinds of tabs to edit the testimonial carousel widget as others. Such as content, style, and advanced.
This command displays a list of all the items in the slide. You can rearrange them by dragging and dropping them. To add an item to the list, click the Add Item button.
- Content: Here you can add the review text of the testimonial.
- Image: This is the image option where you can add image of the client or company logo.
- Name: Here you can set the customer name.
- Title: Here you can set the title like company name.
Skin: Choose any from two pre-designed skins: Default and Bubble. Which will change thw skin of testimonial.
Layout: Image Inline, Image Stacked, Image Above, Image Left, Image Right are all choices you will get here to change the image position.
Alignment: You can set the alignment of the testimonial here.
Slides Per View: From 1 to 10, you can choose the number of slides to display at once.
Slides To Scroll: You can choose the number of slide to scroll in per swipe here from 1 to 10.
Width: Here you can control the width of the testimonial.
- Arrows: From here, you can display or hide the navigation arrow.
- Pagination: You can choose None, Dots, Fraction, or Progress for the carousel pagination theme.
- Transition Duration: Here you can set the interval between slide movements in milliseconds.
- Autoplay: If you want the slider play automatically you can enalbe this option.
- Autoplay Speed: Here you can set the autoplay speed.
- Infinite Loop: If you want the slider slides continuously then enable this option.
- Pause on Interaction: When the carousel is hovered over with a mouse or pressed, it will make the autoplay stop if you enable this option.
- Image Size: Here you can set the size of the image.
Under style tab, you will get four sections. Such as slides, content, image and navigation.
Space between: You can set the space between the list from here.
Background Color: Here you will get the option to set background color.
Border Radius: To make border round you can use border radius.
Border Color: You can change or add border color from here.
Gap: You can easily control the gap between image and testimonial text from here.
Text Color: Here you can set the color of testimonial.
Typography: You can change the typography from here like font-family, font-size, font-weight etc.
Name: Here you can change the color and typography of testimonial client name.
Title: Here you can change the color and typography of testimonial company title.
Size: You can control the image size from here.
Gap: When the image will set as inline then you can control the gap batween image and the name & title from here.
Border: If you enable this that will give you to customize the image border of the image like border color and border witdth.
Border Radius: If you want to make the image border rounded you can set that from here.
Here you can control the size and color of navigation like arrows and pagination size and color. Making sure that these are clear and visible will help people to scroll through and see everything there is to offer.
The Advanced tab is full of useful features:
- Advanced – Options include; margin, padding, z-index, CCS ID and CSS Class.
- Motion Effects – There are a range of scrolling effects, mouse effects, and you can also choose how the selected element enters the screen, the delay and if it is sticky.
- Background – You can select the background for standard and also for hover. You can choose from a solid background and a gradient.
- Border – This allows you to add a border to the element when standard and hover along with the border-radius. You can also add a box-shadow.
- Positioning – You can change how the element is positioned on the page. For the page width, you have default, inline, and custom. For the page position, you have default, absolute, and fixed. Check out this article for a deep look into the positioning properties in Elementor.
- Responsive – The responsive options will allow you to hide certain sections or elements on different screen sizes. This can be useful when redesigning a page for mobile. On certain elements, you can reverse the columns.
- Attributes – (Pro Feature) You can add custom attributes to the element; you can find a full list here.
- Custom CSS – (Pro Feature) You can add CSS to the site or the element through this box. It is best to add the CSS for the element and add the CSS for the global setting site. You can use “selector” to target the specific element you have open.
Remove Testimonal Carousel
To remove or delete the carousel just right click on the testimonial widget from the page and a menu will appear in front of you. You can see the delete option here just click on delete an dit will remove from the page.