All sections

Comparison Table (Listings)

Commerce5 styles20 settings

What this section does

Compares the listings the visitor added to the compare tray, on the spec fields of the product form they share

Where it goes

  • Can be used as many times as you like on one page.
  • This section is in every plan — no extra plugin needed.

Styles

Different looks for the same section. You can change the style later; your content stays as it is.

The first 2 styles of every section are open on every store. The rest unlock with the Page Editor plugin — all at once, not style by style.

  • Spec Table

    Freetable

    Products across the top, one spec per row. The dense, classic listing comparison

    Specific to this style: title, subtitle, emptyText, removeText, clearAllText, showImages, showPrice, highlightDifferences

  • Cards

    Freecards

    One card per product with its specs underneath. Reads better on narrow screens

    Specific to this style: title, subtitle, emptyText, removeText, clearAllText, showImages, showPrice, highlightDifferences

  • Differences First

    Page Editorhighlights

    Rows where the products differ come first at full contrast; everything shared folds into a quiet block below

    Specific to this style: title, subtitle, emptyText, removeText, clearAllText, showImages, showPrice, highlightDifferences

  • Head to Head

    Page Editorversus

    Two products facing each other across a centre VS label rail; falls back to a label-left grid with three or four

    Specific to this style: title, subtitle, emptyText, removeText, clearAllText, showImages, showPrice, highlightDifferences

  • Spec Blocks

    Page Editorstacked

    One block per spec, each product naming its own value; stays readable with long spec lists and narrow screens

    Specific to this style: title, subtitle, emptyText, removeText, clearAllText, showImages, showPrice, highlightDifferences

Settings

The fields you see in the Section Settings panel on the right when this section is selected.

Shared by every style

  • bg
  • contentMaxWidth
  • sectionMaxWidth
  • horizontalPadding
  • verticalPadding
  • verticalAlignment
  • horizontalAlignment
  • horizontalMargin
  • verticalMargin
  • spacingOverrides
  • animationType
  • animationDuration
  • animationDelay
  • animationEasing
  • animationStagger
  • animationRepeat
  • animationParallax
  • imageParallax
  • animationScrollEffect
  • height

This page is generated straight from the product's own section definitions, so a newly shipped section appears here too.

Live Instantly — Launch Your Website Today

Launch your website today.

Start for free. No credit card required. Blog, store, restaurant page, or portfolio — your site is ready in minutes.

No credit card required