Comparison Table Widget

Comparison Table Widget Features for Websites

Help visitors choose with confidence by comparing plans, products, and features side by side. Build columns and rows, fill cells with text, checks, crosses, limited marks, or star ratings, highlight your recommended option, match your brand, and keep the table readable on every screen — all without coding.

Create Your Comparison Table — It’s Free!
Comparison Table Widget Features for Websites Hero Bg Image

How to embed Comparison Table Widget to WordPress

1Get your embed code

After customizing your Jotform website widget, click Try it on your website for free, and copy the generated embed code.

2Open the page editor

Go to the WordPress post or page where you want to display the widget, then add a new block.

3Add a Custom HTML block

Select Custom HTML and paste your Jotform Website widget embed code into the HTML field.

4Update and view

Click Update or Publish, then open the page to check your embedded widget.

Compare Options Side by Side

Lay out plans, products, or services as columns and features as rows so visitors can scan differences at a glance. Fill every cell with the format that fits — plain text, a check for included, a cross for missing, a limited mark for partial, or a star rating — and add tooltips to explain features that need context.

Cell types include:

Text valuesCheck markCross markLimited markStar ratingFeature tooltips
Build Your Table
Compare Options Side by Side

Highlight the Plan You Want to Sell

Guide visitors toward the right choice by marking one column as recommended with an accent border or a filled header. Add a badge such as ā€œMost popular,ā€ show a price and caption under each column, and place a call-to-action button below every option to drive the next step.

Highlight controls include:

Accent borderFilled headerMost popular badgePricing rowCall-to-action buttonsOpen in new tab
Highlight a Plan
Highlight the Plan You Want to Sell

Match Your Brand in a Few Clicks

Switch between a light and dark theme, then fine-tune the table, header, feature column, striped rows, highlighted column, feature icons, rating stars, and buttons with individual color controls. Adjust the corner radius and add scoped custom CSS when you need full control.

Style controls include:

Light themeDark themeHeader & cell colorsIcon & rating colorsCorner radiusCustom CSS
Style Your Table
Match Your Brand in a Few Clicks

Stay Readable on Every Screen

Keep the header row and the feature column in view with floating options on long or wide tables, and set a minimum column width before scrolling begins. On phones, choose horizontal scrolling or stacked cards, and switch between a centered container or a full-width layout.

Layout controls include:

Floating headerFloating feature columnMinimum column widthHorizontal scrollStacked cardsContainer or full width
Make It Responsive
Stay Readable on Every Screen