Fancy Testimonial

Content Controls

Content

This section lets you personalize the testimonial elements with images, ratings, and custom texts for a unique and engaging user experience.

  • Image – Upload a picture to accompany the testimonial.
  • Image Options – Customize the uploaded image. (Note: This control is only available if an image is set.)
    • Size – Choose the display size of the image.
    • Alt – Input an alternative text for the image, enhancing SEO and accessibility.
  • Stars – Assign a star rating to the testimonial.
  • Title – Define a title for the testimonial section.
  • Testimonial – Input the testimonial text here.
  • Name – Enter the name of the person who provided the testimonial.
  • Occupation – Specify the occupation or position of the testimonial author.
  • Button – Add a call-to-action button beneath the testimonial.
    • Text – Set the display text for the button.
    • Link – Insert the URL the button will redirect to.

Design Controls

Layout

Customize the structural layout of your testimonial element, adjusting width, stacking order on different devices, and content positioning for an optimized visual appeal.

  • Width – Set the width of the testimonial element.
  • Stack Vertically at – Decide the breakpoint at which elements stack vertically.
  • Content Position – Align the testimonial content within the element.

Wrapper

Stylize the testimonial wrapper with options for a boxed layout, background color, padding, and creative border designs.

  • Boxed – Toggle for a distinct boxed layout for the testimonial.
  • Background – Choose a background color for the box. (Note: This control is available only when ‘Boxed’ is enabled.)
  • Padding – Adjust the space inside the edges of the box.
    • Padding – Set the specific padding space values.
  • Borders – Design the borders of the testimonial box.
    • Radius – Define the curvature of the box corners.
    • Styling – Customize border style, width, and color.
    • Shadow – Add a shadow effect to the box.

Image

Further refine the testimonial image’s appearance and positioning for a harmonious design integration.

  • Disable – Choose to hide the image.
  • Position – Select the image’s placement relative to the testimonial content.
  • Width – Adjust the image’s width.
  • Height – Set the image’s height.
  • Borders – Apply unique border styles to the image.
    • Radius – Modify the image corners’ curvature.
    • Styling – Change border style, width, and color for the image.
    • Shadow – Attach a shadow effect to the image.

Quotes

Personalize the quotation marks in the testimonial for a visually captivating user experience.

  • Icon – Select a unique icon for the quotation marks.
  • Color – Pick a color for the quote icon.
  • Size – Adjust the size of the quote icon.

Typography

Enhance the text’s visual appeal by customizing font attributes for various sections of the testimonial.

  • Title – Personalize the font style, size, and color for the testimonial title.
  • Testimonial – Adjust the typography for the testimonial text.
  • Name – Modify the font attributes for the author’s name.
  • Occupation – Customize the typography for the author’s occupation.

Stars

Customize the appearance of the star ratings in your testimonial for enhanced visual communication.

  • Position – Choose where to place the star rating relative to the testimonial content.
  • Color – Select a color for the stars.
  • Size – Determine the size of the stars.

Button

Design a compelling call-to-action button by altering its style, typography, and hover effects.

  • Style – Choose a button style from the following options: Primary, Secondary, Custom, or Text.

Spacing

This section allows users to fine-tune the spacing between various elements of the testimonial, ensuring a balanced and well-structured layout. By adjusting these settings, users can achieve a visually harmonious design, tailored to their content needs and aesthetic preferences.

  • After Image – Adjust the space after the image.
  • Below Title – Modify the space below the title.
  • Below Testimonial – Alter the space below the testimonial text.
  • Below Stars – Change the space below the star ratings.
  • Below Name – Adjust the space below the name of the person giving the testimonial.
  • Below Occupation – Adjust the space below the occupation.
  • Wrapper – Configure the overall wrapper spacing.
    • Margin Top – Set the space for the top margin of the wrapper.
    • Margin Bottom – Set the space for the bottom margin of the wrapper.