WooCommerce Product Table plugin fully supports variable products. You can display variations as dropdown lists, together with attribute and category filters. It makes the selection of the necessary products incredibly flexible and fast.
The plugin also comes with such options as displaying the thumbnails of the product according to the variation. “Show variation thumbnails” option allows users to swap different images and see different images of a product variation all in different colour and style.
Moreover, you can either display variations as dropdown lists, as separate rows in the table.
To display every variation as a single product, enable “Show variation” and select products one by one.
In order to display Variable products with images according to the attribute, you need to follow this detailed instruction.
Product table with variation dropdowns
| Thumbnail | Name | Summary | Color | Size | Price | Buy |
|---|---|---|---|---|---|---|
 | Gray top | This is the product full description. | Black, Gray | M | $12 – $13 | $13  |
 | WooBeWoo hoodie | This is the product short description. | Gray, Green | M, S | $10 – $18 | $10 $18 $18  |
 | WooBeWoo top | This is the product short description. | Blue, Gray | XL, XXL | $15 | |
Filter: Reset
#wtbp-table-42_8984_wrapper table {border-collapse: collapse;} #wtbp-table-42_8984_wrapper td {border-top: 2px solid #ffffff;} #wtbp-table-42_8984_wrapper tbody tr:first-child td {border-top: none;} #wtbp-table-42_8984_wrapper tbody tr:last-child td {border-bottom: 2px solid #ffffff;} #wtbp-table-42_8984_wrapper .child table {border-collapse: collapse;} #wtbp-table-42_8984_wrapper th {background-color: #9978db !important;color: #ffffff;} #wtbp-table-42_8984_wrapper tbody tr {background-color: #d8d8d8;} #wtbp-table-42_8984_wrapper tbody td {background-color: inherit;} #wtbp-table-42_8984_wrapper table.stripe tbody tr.even {background-color: #c4c4c4;} #wtbp-table-42_8984_wrapper table.stripe.order-column tbody tr > .sorting_1 {background-color: #c4c4c4;} #wtbp-table-42_8984_wrapper table.hover tbody tr:hover {background-color: #b0b0b0;} #wtbp-table-42_8984_wrapper table.stripe.order-column tbody tr.even > .sorting_1 {background-color: #b0b0b0;} #wtbp-table-42_8984_wrapper table.order-column tbody tr > .sorting_1 {background-color: #c4c4c4;} #wtbp-table-42_8984_wrapper table.hover.order-column tbody tr:hover > .sorting_1 {background-color: #9c9c9c;} #wtbp-table-42_8984 th, #wtbp-table-42_8984 td, #wtbp-table-42_8984.wtbpVarAttributes {vertical-align: middle;} #wtbp-table-42_8984 td {text-align: center;} #wtbp-table-42_8984 .thumbnail img, #wtbp-table-42_8984 .wtbpAddToCartWrapper {margin-left: auto;margin-right: auto;} .wtbpModalContent {width: 80%;} .wtbpModalContent.wtbpModalContentForVariations {max-width: 600px;}
Variations on separate rows
| Thumbnail | Name | Categories | Price | Buy |
|---|---|---|---|---|
| Gray top - Gray | Female, girls, Summer Sale, Top | $13 | |
| Gray top - Black | Female, girls, Summer Sale, Top | |
#wtbp-table-47_606489_wrapper table {border-collapse: collapse;} #wtbp-table-47_606489_wrapper td {border-top: 2px solid #ffffff;} #wtbp-table-47_606489_wrapper tbody tr:first-child td {border-top: none;} #wtbp-table-47_606489_wrapper tbody tr:last-child td {border-bottom: 2px solid #ffffff;} #wtbp-table-47_606489_wrapper .child table {border-collapse: collapse;} #wtbp-table-47_606489_wrapper th {background-color: #aa88e2 !important;color: #ffffff;} #wtbp-table-47_606489_wrapper tbody tr {background-color: #d3d3d3;} #wtbp-table-47_606489_wrapper tbody td {background-color: inherit;} #wtbp-table-47_606489_wrapper table.stripe tbody tr.even {background-color: #bfbfbf;} #wtbp-table-47_606489_wrapper table.stripe.order-column tbody tr > .sorting_1 {background-color: #bfbfbf;} #wtbp-table-47_606489_wrapper table.hover tbody tr:hover {background-color: #ababab;} #wtbp-table-47_606489_wrapper table.stripe.order-column tbody tr.even > .sorting_1 {background-color: #ababab;} #wtbp-table-47_606489_wrapper table.order-column tbody tr > .sorting_1 {background-color: #bfbfbf;} #wtbp-table-47_606489_wrapper table.hover.order-column tbody tr:hover > .sorting_1 {background-color: #979797;} .wtbpModalContent {width: 80%;} .wtbpModalContent.wtbpModalContentForVariations {max-width: 600px;}