If statements in a foreach loop based on Woocommerce product attributes

Question

I was using the following code to set images for each attribute term and it worked just fine only if there was just one term assigned to each product:

function tutsplus_list_attributes( $product ) { 
global $product;
$style = array_shift( wc_get_product_terms( $product->id, 'pa_style', array( 'fields' => 'names' ) ) );
$new = array_shift( wc_get_product_terms( $product->id, 'pa_other', array( 'fields' => 'names' ) ) );

echo '<div class="att">';

if ($style == 'Red Wine') {
    echo '<img src="' . get_template_directory_uri() .'/img/red-wine-icon.png" alt="Red Wine" width="35" height="35"> Red';
}
if ($style == 'White Wine') {
    echo '<img src="' . get_template_directory_uri() .'/img/white-wine-icon.png" alt="White Wine" width="35" height="35"> White';
}
if ($style == 'Rosé Wine') {
    echo '<img src="' . get_template_directory_uri() .'/img/rose-wine-icon.png" alt="Rosé Wine" width="35" height="35"> Rosé';
}
if ($style == 'Sweet') {
    echo '<img src="' . get_template_directory_uri() .'/img/sweet-wine-icon.png" alt="Sweet Wine" width="35" height="35"> Sweet';
}
if ($new == 'New Wines') {
    echo '<img src="' . get_template_directory_uri() .'/img/new-wine-icon.png" alt="New Wine" width="35" height="35">';
}
echo '</div>';
}

add_action( 'woocommerce_single_product_summary', 'tutsplus_list_attributes', 0 );

But obviously, some products will require more than one term i.e. New, White Wine, Sweet.

I've tried adding a foreach loop to to make it work with multiple attribute terms but now it doesn't show anything:

function tutsplus_list_attributes( $product ) { 
global $product;
$style = array_shift( wc_get_product_terms( $product->id, 'pa_style', array( 'fields' => 'names' ) ) );
$new = array_shift( wc_get_product_terms( $product->id, 'pa_other', array( 'fields' => 'names' ) ) );

echo '<div class="att">';

foreach ( $style as $s) {
    if ($style == 'Red Wine') {
        echo '<img src="' . get_template_directory_uri() .'/img/red-wine-icon.png" alt="Red Wine" width="35" height="35"> Red';
    }
    elseif ($style == 'White Wine') {
        echo '<img src="' . get_template_directory_uri() .'/img/white-wine-icon.png" alt="White Wine" width="35" height="35"> White';
    }
    elseif ($style == 'Rosé Wine') {
        echo '<img src="' . get_template_directory_uri() .'/img/rose-wine-icon.png" alt="Rosé Wine" width="35" height="35"> Rosé';
    }
    elseif ($style == 'Sweet') {
        echo '<img src="' . get_template_directory_uri() .'/img/sweet-wine-icon.png" alt="Sweet Wine" width="35" height="35"> Sweet';
    }
    elseif ($new == 'New Wines') {
        echo '<img src="' . get_template_directory_uri() .'/img/new-wine-icon.png" alt="New Wine" width="35" height="35">';
    }
}

echo '</div>';
}

 add_action( 'woocommerce_single_product_summary', 'tutsplus_list_attributes', 0 );

What I am doing wrong? Any help is appreciated.

Answer 1

Update 2:

Here is another new version… For me both of them work. Try this one:

add_action( 'woocommerce_single_product_summary', 'custom_list_attributes', 2 );
function custom_list_attributes( $product ) { 
    global $product;

    $styles = wc_get_product_terms( $product->id, 'pa_style', array( 'fields' => 'names' ) );
    $others = wc_get_product_terms( $product->id, 'pa_other', array( 'fields' => 'names' ) );
    $path = get_template_directory_uri() .'/img/';

    echo '<div class="att">';

    foreach( $styles as $style ){
        if ($style == 'Red Wine') {
            echo '<img src="' . $path .'red-wine-icon.png" alt="Red Wine" width="35" height="35"> Red';
        } 
        elseif ($style == 'White Wine') {
            echo '<img src="' . $path .'white-wine-icon.png" alt="White Wine" width="35" height="35"> White';
        }
        elseif ($style == 'Rosé Wine') {
            echo '<img src="' . $path .'rose-wine-icon.png" alt="Rosé Wine" width="35" height="35"> Rosé';
        }
        elseif ($style == 'Sweet') {
            echo '<img src="' . $path .'sweet-wine-icon.png" alt="Sweet Wine" width="35" height="35"> Sweet';
        }
    }
    foreach( $others as $other ){
        if ($other == 'New Wines') {
            echo '<img src="' . $path .'new-wine-icon.png" alt="New Wine" width="35" height="35">';
            break;
        }
    }
    echo '</div>';
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

---

Original answer: You should try the following (I have revisited and compacted your code):

add_action( 'woocommerce_single_product_summary', 'custom_list_attributes', 2 );
function custom_list_attributes() {
    global $product;

    $colors_array = array( 'Red Wine', 'White Wine', 'Rosé Wine', 'Sweet' ); // Your colors in an array

    $pa_style_terms = wc_get_product_terms( $product->get_id(), 'pa_style', array( 'fields' => 'names' ) );
    $pa_other_terms = wc_get_product_terms( $product->get_id(), 'pa_other', array( 'fields' => 'names' ) );
    $path = get_template_directory_uri() .'/img/';

    echo '<div class="att">';

    if( count($pa_style_terms) > 0 ){
        foreach ( $pa_style_terms as $key => $style) {
            // Check if color match with the colors in the array
            if ( in_array( $style, $colors_array ) ) {
                $color = $colors_array[$key]; // Get the color name
                $color_key = explode( ' ', $color ); // Split each word in color
                $ckey_name = reset( $color_key ); // Keep the first word in the color
                $ckey_slug = strtolower( $ckey_name ); // Make it lower case
                // Displaying each color in the loop
                echo '<img src="' . $path . $ckey_slug . '-wine-icon.png" alt="' . $color . '" width="35" height="35">' . $ckey_name;
            }
        }
    }
    if( count($pa_other_terms) > 0 ){
        if ( reset($pa_other_terms) == 'New Wines') {
            // Displaying
            echo '<img src="' . $path .'new-wine-icon.png" alt="' . reset($pa_other_terms) . '" width="35" height="35">';
        }
    }

    echo '</div>';
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.