1
votes

I am building a Woocommerce site, and the client is going to sale headphones. Each headphone will have multiple colors. In the product's index page he wants to display all product variations instead of 1 headphone.

For example, If i create 1 product and add the variations (color), in the index there will be 1 product, and I will be able to choose a variation in the product detail page.

But I could also create one category, let's say 'headphones' and add each color as a single product and loop through that category to display the same product multiple times just with different colors.

What would be the best approach for this, and if the best approach is to create one single product with color variations, how do I loop through the variations in order to display each single color in the product's index?

2
Create each product independently, not variations. Trying to manage the variations, how the "Product Detail" page behaves, etc. will get confusing / complicated. Keep it simple and use simple products. - random_user_name
That's probably a better way to go. I tried to write a plugin once that would add all the variations to the loop, but it was difficult and I never completed it. - helgatheviking
Thanks for your responses. Do you know any way how could I deep link to a specific product variation then? - drjorgepolanco

2 Answers

3
votes
<?php 
    $variations = $product->get_available_variations();
    foreach ( $variations as $key => $value ) {
?>
    <li>
        <span><?php echo $value['name']; ?></span>
    </li>
<?php
    }
?>

Maybe it could do what you're askin'. Hope it helps

0
votes

I made that way:

<?php 
  $versionvalues = get_the_terms( $product->id, 'pa_variacao');
  foreach ( $versionvalues as $versionvalue ) {
?>
    <li class="ui-state-default  ui-selectee" rel="<?php echo $versionvalue->term_id; ?>">
      <span class="ui-selectee"><?php echo $versionvalue->name; ?></span>
    </li>
<?php
    }
?>

Where 'pa_variacao' is 'pa_' the woocommerce prefix for the custom product variation and 'variacao' is the slug to the custom variation, the <li> is the way that I used to show the variations on my shop.