The block quotes slider widget allows you to display your clients reviews in a beautiful slider.Each review can have a name, info and review text, but also an avatar and stars based reviews.Choose between multiple layouts and style everything about the widget elements.
You can find more details about this widget down below.
The block quotes content is where you will set up your clients reviews.You can add a block quote item to the list by clicking on the add item button at the bottom of this section.For each item, you can change the following options :
Unique Styling : You can use this to specify the behavior of the unique styling.The unique styling color can be changed with the hover controls in the styling tab. The options are :
-None : This will disable the unique styling including any hover effect.
-Only Hover : The unique styling will only be applied to the hovered slide.
-Only Active : The unique styling will only be applied to the active slide.If you are using more than 3 slides the active slide will be in the middle.If you are using 3 or less slides the active slide will be on the far left.
-Both Hover & Active : This will enable the unique styling for both the hover and active states of the slides.
Under the layout section, you will be able to change the layout style and control the position and the alignment of each element of the block quotes slider widget.This will give your more options for setting up your own custom layout.
The star rating feature is going to be the factor that all your reviews are going to be based on.
This is where you will set up your block quote slider icons and icons positioning by using the following options.
The styling tab offer you the tools to control the styling & design of all your block quote slider widget elements.Fonts, colors, background, margins, everything can be customized.
Customize the text elements, author name, author info & text review. Change the font size, letter spacing... choose from hundreds of Google font families.
-Colors : Customize the color of your text elements.Additionally, you can use some powerful colors combinations to create fancy hover effects.
Control everything about your icon, apply a custom icon size and color.
-Size & Margins : Change the icon size and control the space between the icon and the other elements.
-Colors : Change the icon color for both the normal and hover states of the widget.
-Colors : Change the review stars colors scheme color for both the normal and hover states.
-Margins : Control the space between the review stars and the other elements of the widget.
The two bottom sections available in the styling tab are the container and the avatar styling.You can change the options down below to have more control on the container space but also to customize the colors and create your very own design.
-Radius & Padding : Change the container radius if you want to use a more rounded shape and alternate the padding values to control the space inside the container.
-Background : Customize the background & choose to apply either a solid background color or a gradient color for both the normal and hover states of the container.
-Size & Margins: Change the avatar size and control the space between the avatar image and the other elements.
-Radius, Border & Box Shadow: Customize the avatar radius to change the image shape and add a border and a box shadow to add even more design to this element.Note that these options are available to be changed for both the normal and hover states.
Under the avatar styling, you can find the slider styling settings section.This section is going to be used to customize the slider design and to enable additional features.
You can enable and customize the slider navigation for the widget.
-Distance Between Dots
-Navigation Area Margins
Enable the slider arrows and change everything about their style and position.
To the right of the content and style tabs, you will find the settings tab.This tab is mainly going to be used to configure the functional settings of the slider and to change the slider behavior for tablets and phones.
-Adaptative Height & Center Mode
If you can't find what you are looking for any our documentation website, please feel free to open a support ticket & get help from our support team.