Fraud Blocker

Table Of Contents

How to use Comparison List widget

With the comparison list widget by Element Pack Pro, you can create product, services, or software package comparison lists in order to show the differences or advantages of different packages very easily.

Let’s explore the customizations.

Inserting Widget

comparison list widget inserting

Use the search bar of the Elementor editor page, search by typing Comparison List, and then the widget will appear on the menu. Just Drag it and Drop it on the page.

Content Tab Customizations

Comparison List section

Go to Content > Comparison List

Screenshot 2 - BdThemes

First, the Titles field lets you add the feature/comparison titles one after another. Using the pipe ” | ” character, you will have to separate the titles. By default, there will be 3 titles that you can increase, decrease, or change the text anytime you want.

Screenshot 3 - BdThemes

The Active Item field determines which title will be highlighted in the list. The number here will base on the numerical sequence from left to right, excluding the first title.

Screenshot 4 - BdThemes

Below are the feature items listed in box shapes. Here, you can find a Duplicate and Close button on each feature item box. Also, there will be an Add Item button below which you can click to add new items.

Screenshot 5 - BdThemes

Clicking on a feature item box will unfold the inner options with a Title field and a Description field. By customizing the title and text, you can change the detail about the features on the display.

Screenshot 6 - BdThemes

The Feature Ability field determines if the particular feature is available for the next titles. Here, 0 means no, and 1 means yes. You have to line up the numbers per sequence with the pipe ” | ” character.

Style Tab Customizations

Header Feature section

Go to Style > Header Feature

Screenshot 7 - BdThemes

The first section within the style tab lets you customize the color of the Feature Title separately under the corresponding subsection. The options are Color, Hover Color, and Typography.

Screenshot 8 - BdThemes

The same options are available in the Regular Title subsection also. The regular title means all other titles except for the featured one.

Screenshot 9 - BdThemes

For the Active Title, apart from the text Color and Hover Color options, you can customize the text Background Color which tells apart the active feature list from others.

Screenshot 10 - BdThemes

Then you can customize the Border Type, Border Radius, and Padding to refine the shape of the background.

Screenshot 11 - BdThemes

Using the Box Shadow and Typography, you can enhance the visuals by adding a subtle shadow property to the background and changing the font style.

List Item section

Go to Style > List Item

Screenshot 12 - BdThemes

In this section, you can customize the list item Background Color, Border Type, Width, Color, Radius, Padding, and Box Shadow. In the image, we went with the minimum by editing the background and border color with a thin border width and top-right border radius values.

List Item Title section

Go to Style > List Item Title

Screenshot 13 - BdThemes

There are separate Color, Hover Color, Icon Color, Icon Size, and Typography customizations for the list item titles.

Screenshot 14 - BdThemes

And the text Color and Icon Color are editable for the Active mode also.

Feature Ability (Check) section

Go to Style > Feature Ability (Check)

Screenshot 15 - BdThemes

This section lets you customize the check sign ( for 1 value input on features ) by letting you customize the Color, Background, Border, Padding, and Box Shadow for Normal, Hover, and Active modes.

Feature Ability (Close) section

Go to Style > Feature Ability (Close)

Screenshot 16 - BdThemes

This section lets you customize the close sign ( for 0 value input on features ) by letting you customize the Color, Background, Border, Padding, and Box Shadow for Normal, Hover, and Active modes.

Content section

Go to Style > Content Section

Screenshot 17 - BdThemes

Lastly, you can customize the content belonging to the feature items by changing the Color, Typography, Background, Border, Padding, and Box Shadow properties.

With all these familiar options, you can easily create unique feature lists using our widget.

Video Assist

The Comparison List widget video coming soon. Please check the demo page for examples.

Thanks for staying with us.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 30-days money-back guarantee.

BdThemes is the sole owner of #1 market-leading addons for Elementor such as Element Pack Pro, Prime Slider, Ultimate Post Kit, Ultimate Store Kit, Pixel Gallery, and more useful plugins.

This website is powered by Element Pack Pro and Rooten Theme.

Need any assistance? Call Us:+880 1700 55 95 95

Copyright © 2023 BdThemes. All Rights Reserved.

Our supported payment system and security badge