Software Developer

Show WooCommerce Product Attributes on Cart Page

This is now available as a free plugin on the WordPress repository: WooCommerce Show Attributes

Here are two examples for how to display product attributes on the WooCommerce Cart page. This uses a Woocommerce hook, ‘woocommerce_cart_item_name’, which will make the product attributes appear under the item name on the shopping cart (checkout) page. This goes in your functions.php file, not inside a template file.

To show product attributes on single product pages, see Show WooCommerce Custom Product Attributes Programmatically with functions

Show All Product Attributes listed on new lines

This example shows all product attributes for each item listed under the item name, one attribute below the other (each attribute on a new line). For example:

Product Name
Attribute label 1: value
Attribute label 2: value
Attribute label 3: value

Here is the code for your functions file:

/**
* WooCommerce: show all product attributes listed below each item on Cart page
*/
function isa_woo_cart_attributes( $cart_item, $cart_item_key ) {
   
    $item_data = $cart_item_key['data'];
    $attributes = $item_data->get_attributes();
       
       
    if ( ! $attributes ) {
        return $cart_item;
    }
       
    $out = $cart_item . '<br />';
      
    foreach ( $attributes as $attribute ) {

        // skip variations
        if ( $attribute->get_variation() ) {
            continue;
        }
        $name = $attribute->get_name();
        if ( $attribute->is_taxonomy() ) {
                      
            $product_id = $item_data->get_id();
            $terms = wp_get_post_terms( $product_id, $name, 'all' );

            if ( ! empty( $terms ) ) {
                if ( ! is_wp_error( $terms ) ) {

                    // get the taxonomy
                    $tax = $terms[0]->taxonomy;

                    // get the tax object
                    $tax_object = get_taxonomy($tax);

                    // get tax label
                    if ( isset ( $tax_object->labels->singular_name ) ) {
                        $tax_label = $tax_object->labels->singular_name;
                    } elseif ( isset( $tax_object->label ) ) {
                        $tax_label = $tax_object->label;
                        // Trim label prefix since WC 3.0
                        $label_prefix = 'Product ';
                        if ( 0 === strpos( $tax_label,  $label_prefix ) ) {
                            $tax_label = substr( $tax_label, strlen( $label_prefix ) );
                        }
                    }
                    $out .= $tax_label . ': ';
                    $tax_terms = array();
                    foreach ( $terms as $term ) {
                        $single_term = esc_html( $term->name );
                        array_push( $tax_terms, $single_term );
                    }
                    $out .= implode(', ', $tax_terms). '<br />';

                }
            }
             
        } else {
         
            // not a taxonomy 
             
            $out .= $name . ': ';
            $out .= esc_html( implode( ', ', $attribute->get_options() ) ) . '<br />';
        }
    }
    echo $out;
}
   
add_filter( 'woocommerce_cart_item_name', isa_woo_cart_attributes, 10, 2 );

List All Product Attributes Separated by Comma

This example lists all the product attributes, side by side, separated by comma. It will list the attribute labels and values. For example:

Product Name
Attribute label 1: value, Attribute label 2: value, Attribute label 3: value

If you want to show only the values, without labels, then comment out lines 48 and 68, below.

/**
* WooCommerce: show all product attributes, separated by comma, on cart page
*/
function isa_woo_cart_attribute_values( $cart_item, $cart_item_key ) {
 
    $item_data = $cart_item_key['data'];
    $attributes = $item_data->get_attributes();
     
    if ( ! $attributes ) {
        return $cart_item;
    }
     
    $out = $cart_item . '<br />';
     
    $count = count( $attributes );
     
    $i = 0;
    foreach ( $attributes as $attribute ) {
  
        // skip variations
        if ( $attribute->get_variation() ) {
             continue;
        }
  
        $name = $attribute->get_name();          
        if ( $attribute->is_taxonomy() ) {

            $product_id = $item_data->get_id();
            $terms = wp_get_post_terms( $product_id, $name, 'all' );
              
            // get the taxonomy
            $tax = $terms[0]->taxonomy;
              
            // get the tax object
            $tax_object = get_taxonomy($tax);
              
            // get tax label
            if ( isset ( $tax_object->labels->singular_name ) ) {
                $tax_label = $tax_object->labels->singular_name;
            } elseif ( isset( $tax_object->label ) ) {
                $tax_label = $tax_object->label;
                // Trim label prefix since WC 3.0
                $label_prefix = 'Product ';
                if ( 0 === strpos( $tax_label,  $label_prefix ) ) {
                    $tax_label = substr( $tax_label, strlen( $label_prefix ) );
                }
            }
            $out .= $tax_label . ': ';

            $tax_terms = array();              
            foreach ( $terms as $term ) {
                $single_term = esc_html( $term->name );
                array_push( $tax_terms, $single_term );
            }
            $out .= implode(', ', $tax_terms);
             
            if ( $count > 1 && ( $i < ($count - 1) ) ) {
                $out .= ', ';
            }
         
            $i++;
            // end for taxonomies
     
        } else {
 
            // not a taxonomy
             
            $out .= $name . ': ';
            $out .= esc_html( implode( ', ', $attribute->get_options() ) );
         
            if ( $count > 1 && ( $i < ($count - 1) ) ) {
                $out .= ', ';
            }
         
            $i++;
             
        }
    }
    echo $out;
}
add_filter( 'woocommerce_cart_item_name', isa_woo_cart_attribute_values, 10, 2 );

By

We've 8 Responses

  1. May 6th, 2014 at 6:49 am

    Hi thanks for this piece of code. I used your code, but I found an issue on my end. Not sure if it’s entirely my fault or just the code itself. But the cart shows only “pa_weight: , pa_brand: “. Instead of showing just the pa_name: value, pa_name2: value2 = “Weight: 1 lb, Brand: Safeway”. Do you have any idea why is this happening?

    I would like to go further, and only display the value of the attribute, is this possible?

    Thanks

    avatar
  2. June 12th, 2014 at 4:02 pm

    Hi, Isabel. Thank you for providing this code however I’m having the same issues as the previous comments. The value is not being listed. All I’m getting is PS_SIZE: under my product title. Please let me know if there’s a fix for this.

    Thanks,

    avatar
  3. July 11th, 2014 at 6:12 am

    Hi Isabel.

    I am trying to modify your code to display different messages on the cart page based on different values of product attributes. I’m not that good with code so it’s taken me a few days and still no luck.

    What I want to do is show “Message A” for products that have value “A” in product attribute A.
    And also “Message B” for products that have value “B” in product attribute B.

    I have tried all kinds of combinations in my coding but nothing has been correct.
    Do you have any tip or a tutorial for this? 🙂

    Kindest regards,
    Kurre

    avatar
    • August 3rd, 2014 at 1:55 pm

      It sounds like you would need to add “Variations” instead of attributes. For “Product Data”, select “Variable product”. Then you’ll see the “Variations” tab. In there, click “Add Variation”. See WooCommerce docs regarding Product Variations. I hope this helps.

      avatar
  4. January 20th, 2015 at 7:06 pm

    Thank you ahead for any help, this is a nice plugin! But can not for the life of me, find the “Product data” settings, I follow the logic to the WP settings page/product tab, hoping to see “Product Data” — all i see is Product Options | Inventory.

    I am using “WooCommerce Show Attributes” with WC, Version 2.2.10.

    It works great on the Products themselves, to add custom attributes and I can control there styles via your helpful notes.

    BUT – I’d like to remove the attributes from the cart, as I am using a cart widget and now have all these “attributes” crowding my widget area.

    Was hoping maybe there was a check box for showing or not showing custom attributes in the cart page. Was hoping maybe there is even a check box for this in that elusive, “product data” tab. Maybe I’m missing something. Also using “Customizer” plugin as well.

    Thank you!

    avatar
    • February 4th, 2015 at 2:11 am

      I’m very sorry for the delay. WooCommerce Show Attributes version 1.4.1 was just released. It adds 16 new options to give you more control over where to show the attributes. With these new settings, you’ll be able to disable the attributes from showing on the Cart page.

      The settings have moved. They are now located at WooCommerce Settings –> Products tab –> WC Show Attributes.

      (The “Product Data” was a sub-heading within the regular “Product Options” page. It was confusing, so now the settings have moved to our own page.)

      I hope this helps.

      avatar