BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Pro widget

Comparison Table Widget for Elementor Pro

Compare plans or products feature by feature

Overview

What Comparison Table does

Comparison Table lines up plans or products in columns and compares them row by row with yes, no and partial icons or your own text. It keeps the header in view on long tables, groups rows under headings that can collapse, and shows one plan at a time on phones. Use it under a pricing table or on a product comparison page.

Live demo

See it in action

Show plan:
Compare plans Pick the plan that fits your work. Free $0 Choose Popular Plus $45 / year Choose Team $99 / year Choose
Websites 1 Unlimited
Widgets 20 60+
Template library Ready-made pages and sections you can import. Partly included Included
Email support Not included Included
Priority support Replies within 12 hours Not included Included
Choose Choose
Features

What it can do

  • Columns with a title, price or subtitle, icon, badge and button

  • Row values typed in one line: yes, no, partial, an icon with text, or plain text

  • Sticky header row with an offset for a sticky site header

  • Sticky first column when the table scrolls sideways

  • Group headings that visitors can open and close

  • One highlighted column with its own colors and button style

  • Phone view with a picker that shows one plan at a time

  • Striped rows, row and column hover highlight, and row tooltips

Use cases

When to use it

Plan comparison

List every feature of your Free, Pro and Agency plans below the pricing cards.

Product versus product

Compare two or three products on specs, using text values such as sizes and limits.

Long feature lists

Split a long table into groups such as Essentials and Support and start with only the first group open.

Setup

How to set it up

A few steps from adding the widget to a finished result.

  1. Add the Comparison Table widget to your page.

  2. In Columns, type the First Column Heading and add one item per plan with a Title, Price or Subtitle, Badge and Button Text.

  3. Turn on Highlight This Column for the plan you want to stand out.

  4. In Rows, add a row per feature. Type the Label and the Values, one per column, separated by |.

  5. Add rows with Row Type set to Group Heading to split the table into sections.

  6. In Settings, set Sticky Header, On Phones, Collapsible Groups and the yes, no and partial icons.

  7. Style the table, header, cells and buttons in the Style tab.

FAQ

Questions and answers

How do I enter the values for a row?

Type one value per column in the Values field, separated by |, for example: yes | no | partial. Any other text is shown as it is.

What happens if a row has fewer values than columns?

The remaining cells are left empty.

Can I highlight more than one column?

You can switch it on for several columns and each gets the highlighted style, but the phone picker starts on the first of them.

Do the icons work for screen readers?

Yes. Each icon has hidden text that you can edit under Screen Reader Text in Settings.

Bright Addons Pro

Get Comparison Table with Bright Addons Pro

Bright Addons Pro has 80 Pro widgets plus all 51 free widgets, 10 extensions, a Theme Builder and 32 dynamic tags. From $18 a year, with a 14-day money-back guarantee.