Skip to content
Milano Docs

Variation Compare

Variation Compare adds a Compare button to variable product pages. When clicked, it opens a modal that shows all variations of a primary attribute (like Color) side by side so customers can compare them visually.

Turn on Variation Compare

Section titled “Turn on Variation Compare”
  1. Go to Milano Dashboard → Modules.
  2. Find Variation Compare and turn the toggle on.

Configure

Section titled “Configure”
  1. Go to WooCommerce → Settings → Products → Variation Compare.
  2. Set:
    • Primary attribute — The attribute that drives the comparison (for example, Color).
  3. Click Save Changes.

How it works

Section titled “How it works”

On a variable product page, a Compare button appears near the attribute options. Clicking it opens a modal showing all variations grouped by the primary attribute, each with its image. Customers can scroll through and compare at a glance.

The comparison modal includes:

  • Variation images at full size.
  • The attribute label for each variation.
  • A Select button to choose that variation and close the modal.

Requirements

Section titled “Requirements”
  • WooCommerce must be installed and active.
  • Variable products must have at least one attribute with images on the variations.