Every shopper comparing two products ends up doing the same thing: opening both in separate tabs and flicking between them. It works, badly, and half of them lose the thread and leave. A comparison table fixes that by putting the differences in one place, but on WooCommerce it usually means installing a dedicated compare plugin and inheriting its markup, its scripts and its opinions. The Product Compare widget does the job inside Elementor with no compare plugin behind it: the list lives in the visitor’s own browser. Sentio built the Elementor Product Compare widget so the decision a shopper is already trying to make can happen on your page.
What Is the Product Compare Widget?
The Product Compare widget is three components in one, chosen from a single dropdown. The table lays products out side by side, one column each, with attribute labels down a frozen first column. The button is an “Add to Compare” toggle you can place on any product, in a grid, or on a single-product template. The bar is a floating strip that tracks how many products are on the list and links through to the table. The list itself is kept in the browser’s local storage, which means no account, no database writes, and no third-party compare plugin. Every Elementor Product Compare instance reads the same list, so a button anywhere on the site feeds the table anywhere else.
Key Features of the Product Compare Widget
- No compare plugin required — the comparison list is held in local storage, so there is nothing to install alongside it and nothing stored server-side.
- Eleven comparable fields — image, price, rating, stock, description, SKU, weight, dimensions, categories, custom attributes and an add-to-cart row.
- Best value highlighting — each row can highlight the winning cell automatically, so the difference is visible without reading every number.
- Sticky labels and horizontal scroll — the attribute column stays frozen while the product columns scroll sideways, which is what makes the table usable on a phone.
Why Use the Product Compare Widget on Your Site?
Comparison is the last step before a decision, and it is the step most stores hand back to the browser’s tab bar. The Product Compare widget keeps it on your page. A coffee roaster selling three roasts at three weights can let shoppers line them up on price per bag, weight and grind. A homeware store can put the toggle button on every card in a grid and let the floating bar follow the shopper until they are ready. A shop with technical products can lean on SKU, weight and dimensions rows, and let the best-value highlighting do the explaining. Because the list is local to the browser, none of this needs a login, and because the whole thing is one widget, the button, the bar and the table are styled from the same panel rather than three plugin settings screens. The same Elementor Product Compare setup works on a phone, where the frozen label column is the difference between a usable table and a mess.
Getting Started With Product Compare in Minutes
Install Sentio Addons on a store running WooCommerce and decide which component the page needs. For the table, drop the Elementor Product Compare widget on a dedicated compare page, pick the fields to show, set a maximum number of products, and switch on best-value highlighting and sticky labels. For the button, place the widget wherever products appear and either set a product ID or let it read the current product on a single-product template. For the bar, choose top or bottom and point it at your compare page. Style the table, button and bar from the same panel, and the three components will agree with each other because they share one settings screen.
See the Product Compare Widget in Action
The widget page above this article is interactive rather than static. Three add-to-compare buttons sit at the top, one per coffee. Add them and watch the table underneath build itself column by column, with the cheapest price and lightest bag highlighted. The floating bar keeps count as you go, and the remove buttons take products back out again.
The moment a shopper starts comparing is the moment they are closest to buying, and it is a poor time to send them to a tab they might not come back from. Reach for the Product Compare widget for Elementor and that moment stays on your page, in your design, with no extra plugin underneath it. Sentio Addons keeps building practical, design-system-friendly widgets like this because publishing teams need real tools, not toy components.