Variants tree

Let's assume you have product with these product attribute values:

• Size: M, L

• Color: yellow, red

• Material: cotton, silk

If all these product attribute values were used for generating product variants, then you would end up with 8 different combinations of product attribute values.

Choice of options drop-down menu with product variants

Variants tree property helps you narrowing down the options for customer to get to the desired product variant with chosen product attribute values. Example use-case would be to show selected boxes to customer.

It doesn't matter which product attribute you will use as first, because there are all in the first dimension of the array. Then, if you go deeper, you will get the remaining attribute values to further narrowing down the product variant selection until you end up with exactly filtered product variant. Verify that the end node of the variants tree includes the uuid and slug keys.

Structure of the variants tree:

$productAttributeName1 => [
    $productAttributeValueName1 => [
        $productAttributeName2 => [
            ...
        ]
    ]
]

A real-word example of a variant tree

"variants_tree": {
      "Size": {
        "S": {
          "Color": {
            "yellow": {
              "Material": {
                "cotton": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "silk": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                }
              }
            },
            "red": {
              "Material": {
                "cotton": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                },
                "silk": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                }
              }
            }
          },
          "Material": {
            "cotton": {
              "Color": {
                "yellow": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "red": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                }
              }
            },
            "silk": {
              "Color": {
                "yellow": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                },
                "red": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                }
              }
            }
          }
        },
        "M": {
          "Color": {
            "yellow": {
              "Material": {
                "cotton": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                },
                "silk": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                }
              }
            },
            "red": {
              "Material": {
                "cotton": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                },
                "silk": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          },
          "Material": {
            "cotton": {
              "Color": {
                "yellow": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                },
                "red": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                }
              }
            },
            "silk": {
              "Color": {
                "yellow": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                },
                "red": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          }
        }
      },
      "Color": {
        "yellow": {
          "Size": {
            "S": {
              "Material": {
                "cotton": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "silk": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                }
              }
            },
            "M": {
              "Material": {
                "cotton": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                },
                "silk": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                }
              }
            }
          },
          "Material": {
            "cotton": {
              "Size": {
                "S": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "M": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                }
              }
            },
            "silk": {
              "Size": {
                "S": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                },
                "M": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                }
              }
            }
          }
        },
        "red": {
          "Size": {
            "S": {
              "Material": {
                "cotton": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                },
                "silk": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                }
              }
            },
            "M": {
              "Material": {
                "cotton": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                },
                "silk": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          },
          "Material": {
            "cotton": {
              "Size": {
                "S": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                },
                "M": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                }
              }
            },
            "silk": {
              "Size": {
                "S": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                },
                "M": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          }
        }
      },
      "Material": {
        "cotton": {
          "Size": {
            "S": {
              "Color": {
                "yellow": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "red": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                }
              }
            },
            "M": {
              "Color": {
                "yellow": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                },
                "red": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                }
              }
            }
          },
          "Color": {
            "yellow": {
              "Size": {
                "S": {
                  "uuid": "e62ea1a0-5aaf-4c5c-b3c9-b454543c5287",
                  "slug": "s-yellow-cotton"
                },
                "M": {
                  "uuid": "32977208-4d5e-4feb-8da0-5b85193fe782",
                  "slug": "m-yellow-cotton"
                }
              }
            },
            "red": {
              "Size": {
                "S": {
                  "uuid": "dd168086-1262-4627-a7e6-787c77aa4eb3",
                  "slug": "s-red-cotton"
                },
                "M": {
                  "uuid": "bdca942a-a7c8-47a0-842a-161adeb69e71",
                  "slug": "m-red-cotton"
                }
              }
            }
          }
        },
        "silk": {
          "Size": {
            "S": {
              "Color": {
                "yellow": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                },
                "red": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                }
              }
            },
            "M": {
              "Color": {
                "yellow": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                },
                "red": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          },
          "Color": {
            "yellow": {
              "Size": {
                "S": {
                  "uuid": "4707f9bc-5a99-4ed3-b542-ef0324701057",
                  "slug": "s-yellow-silk"
                },
                "M": {
                  "uuid": "b09c4361-10da-4591-9221-81e9af52a389",
                  "slug": "m-yellow-silk"
                }
              }
            },
            "red": {
              "Size": {
                "S": {
                  "uuid": "c7ce66ff-8ee4-44fe-b553-617ce5e1aa0e",
                  "slug": "s-red-silk"
                },
                "M": {
                  "uuid": "049c002d-ec84-4991-bf4b-5488637150dd",
                  "slug": "m-red-silk"
                }
              }
            }
          }
        }
      }
    }