Testimonials Element

12/03/2019

The Testimonials Element allows you to easily add beautifully styled testimonials anywhere to your site. Testimonials are the perfect way to show your potential clients the kind of work you can provide. Avada allows you to use testimonial sliders or individual testimonial boxes. Choose between two design styles, male, female or custom icons, and also select the speed at which the slider rotates. Read below for an overview of the specific features of the Element.

Thank you for your very professional and prompt response. I wished I had found you before I spent money on a competitors theme.
William Genske, Avada Theme
The ThemeFusion team provides excellent support, listens to their users & continually works to improve their product.
Lisa Smith, Avada Theme
View more Examples!

How To Use The Testimonials Element

The Testimonials Element is a very useful way of adding testimonials into your page content.

Step 1 - Create a new page or edit an existing one.

Step 2 - Add a container then select your desired column layout.

Step 3 - Click the '+ Element' button to bring up the Elements window. Locate the 'Testimonials' element and click it to bring up its options window.

Step 4 - The options on the right hand side are Parent Options, and affect the whole series of testimonials (if you have more than one), while the individual testimonials are configured on the left hand side. This element has a range of options, starting with two designs. Make sure to view the Element Demo page, to fully appreciate the different layouts and options on offer.

Step 5 - Once you have chosen your design, you can slowly move down the Parent Options, deciding how to style the testimonials. There are navigation, speed and styling options for you to configure.

Step 6 - Once you have set all your Parent Options, you add Child Items on the left. Click the pencil icon to edit the existing item. The Child Item Options Panel appears. This is where you add the content for the individual testimonials. Here, you add the person's name, choose an avatar (including the options to upload your own image), the company name, a link for the company name, and the actual testimonial content.

Step 7 - You can then set up other testimonials, either by duplicating existing ones, or creating new testimonials, by clicking on the Clone Item icon, or the + Testimonials button respectively.

Step 8 - Once you have completed adding your testimonials, click Save. You will be returned to the edit page. You can preview the page to view the testimonials, and you can always edit the element again to make changes.

Read below for a detailed description of all element options.

Element Options

Location: The edit screen within each Element.

You can deploy as many individual Elements in pages and posts as you need, there is no limit. Within each of the Elements, you will see a tab or tabs that house an array of options that make it possible for you to configure each Element independently, and greatly enhance your flexibility and creative options.

Note: The Default setting will use the global settings assigned for this element in your Theme Options > Fusion Builder Elements > Testimonials Elements section. Also, please note that the displayed options screens below show ALL the available options for the element. If you have Avada's Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.

Parent Options

  • Design - Choose a Design style for your Testimonials. Choose from Classic and Clean.
  • Navigation Bullets - Select to show navigation bullets.
  • Testimonials Speed - Set the speed of the testimonial slider. ex: 1000 = 1 second. IMPORTANT: Setting speed to 0 will disable autoplay for testimonials slider.
  • Background Color - Controls the background color.
  • Text Color - Controls the text color.
  • Random Order - Turn on to display testimonials in a random order.
  • Element Visibility - Allows you to choose which devices to display the element. Choose one or more from Mobile, Tablet, or Desktop. Each of the 3 sizes has a custom width setting on the Fusion Builder Elements tab in the Theme Options.
  • CSS Class - Allows you to add a class name to the wrapping HTML element. The class name does not have to be unique, but all areas with the same name will reflect any changes made to the class.
  • CSS ID - Allows you to add an ID to the wrapping HTML element. The ID must be unique to each CSS ID.

Add / Edit Settings

  • Add / Edit Items - This is where all your child element's items are found. Each will be numbered to better keep track of how many you currently have. You can reorder elements by dragging them and dropping them into place.
  • Edit Item Icon - Allows you to edit an item.
  • Clone Item Icon - Allows you to clone an item. Cloned items will automatically be added to the bottom of the items list.
  • Delete Item Icon -  Allows you to delete an item.
  • Re-order Feature -  Allows you to drag and drop the item to your desired order to rearrange them. A small thumbnail of the image is shown to assist you in this.
  • Add New Testimonial Button -  Allows you to add a new Testimonial Button.
View The Options Screen

Child Options

  • Name - Enter the name of the person for the Testimonial.
  • Avatar - Choose your desired avatar. You can choose from Female, Male, Image, or None.
  • Custom Avatar - Upload a custom avatar image.
  • Border Radius - Choose the radius of the testimonial image. In pixels (px), e.g: 1px, or "round".
  • Company - Insert the name of the company. To leave empty, just click in the field to delete the placeholder text.
  • Link - Add a URL the company will link to.
  • Link Target - Choose whether the link will open in the same browser tab (_self) or a new tab (_blank).
  • Testimonial Content - Add your testimonial content here.
View The Options Screen

Global Options

Location: WordPress Dashboard > Avada > Theme Options > Fusion Builder Elements > Tabs Elements. These global element options control all elements that use a carousel.

The Avada Advanced Options Network gives you amazing flexibility with additional Global Element Options that allows you to control individual Element default settings.

  • Testimonial Background Color - Controls the color of the testimonial background.
  • Testimonial Text Color - Controls the color of the testimonial text.
  • Testimonials Speed - Controls the speed of the testimonial slider. ex: 1000 = 1 second. IMPORTANT: Setting speed to 0 will disable autoplay for testimonials slider.
  • Random Order - Turn on to display testimonials in a random order.
View The Options Screen

Testimonials Element Parameters

Copy to Clipboard

Parent Settings

  • design - Choose from classic, or clean. Sets the testimonial's design.
  • navigation – Show or Hide navigation bullets.
  • speed - Sets the speed of the testimonial slider. ex: 1000 = 1 second. IMPORTANT: Setting speed to 0 will disable autoplay for testimonials slider.
  • backgroundcolor - Accept a hexcode ( #000000 ). Sets the background color.
  • textcolor - Accept a hexcode ( #000000 ). Sets the text color.
  • random - Choose from default, yes, or no. This will enable or disable the randomization of the testimonial order.
  • hide_on_mobile - Choose from small-visibility, medium-visibility or large-visibility. You can select more than one setting. This will show the element on the selected visibility options, and will hide them on the deselected ones.
  • class - Add a custom class to the wrapping HTML element for further css customization. Learn more here.
  • id - Add a custom id to the wrapping HTML element for further css customization. Learn more here.

Child Settings

  • name - The client's name. For example, John.
  • avatar - Choose from male, female, none, or image. Sets the avatar.
  • image - The URL path of the custom avatar image. For example, http://www.sample.com.
  • image_border_radius - Accepts a pixel value. For example, 1px. Sets the border's radius size.
  • company - The client's company name. For example, ThemeFusion.
  • link - the URL path of the company. For example, http://www.theme-fusion.com/.
  • target - Choose from _blank or _self. Choose _blank to open the link in a new window, or _self to open it in the same window.
  • custom content - Insert the testimonial between the
    Copy to Clipboard

    tags.