Display WooCommerce Attributes on the Shop Page

You’ve probably seen it before when viewing other eCommerce stores; the products display which attributes (or variations) are available for a product. At this point, you’ve probably asked yourself “how do I display attributes on the shop page of my WooCommerce store?”.
Right?
Well let me guide you through it with 3 potential methods:
Method 1: Code it Yourself
Let’s think about what we want to achieve here:
Display an attribute (or attributes) like “Color” under each product in the WooCommerce shop.
Display each attribute value, and indicate it’s availability with a strikethrough.
Only show attributes on variable products where the attribute is used for variations.
The first thing we’ll do is hook into the loop. We’ll output out attributes after the product title, so I’m going to use the woocommerce_shop_loop_item_title action.
12345678910111213141516171819202122232425262728293031323334
/** * Display available attributes. * * @return array|void */function iconic_available_attributes() {global $product;if ( ! $product->is_type( ‘variable’ ) ) {return;}$attributes = iconic_get_available_attributes( $product );if ( empty(
Source: https://managewp.org/articles/17370/display-woocommerce-attributes-on-the-shop-page

source https://williechiu40.wordpress.com/2018/04/27/display-woocommerce-attributes-on-the-shop-page/