Show product attributes to the product page in wordpress.

Have some of you asked the question how to show product attributes on the product page? Today I will show you how to show products on the product page

Show product attributes to the product page in wordpress

What are product attributes?

Product attributes are detailed information and unique characteristics of each item such as: color, size, pattern, material… Choosing as many attributes will help increase the visibility of the product when people buy do a search for that product on Sendo.

In Woo you go to the attribute, there will be like the table above to enter product attributes,

After having the attribute, when you post the product, remember to select the attribute to be able to show it

How to get product attributes

you go to the file function.php theme you are using (preferably using child themes), add the following line of code

//Show thuộc tính ở trang Sản phẩm – Flatsome.xyz
add_shortcode( ‘thongtin111’, ‘de_xuat_thuoctinh’ );
add_action( ‘woocommerce_before_add_to_cart_form’, ‘de_xuat_thuoctinh’ );
function de_xuat_thuoctinh(){
global $product, $post;
$attribute_taxonomies = wc_get_attribute_taxonomies();
$html='<ul class=”prod-attrs”>’;

if ( $attribute_taxonomies ) :
foreach ($attribute_taxonomies as $tax) :
if (taxonomy_exists(wc_attribute_taxonomy_name($tax->attribute_name))) :
$tt = wp_get_post_terms($post->ID, wc_attribute_taxonomy_name($tax->attribute_name), ‘orderby=name&hide_empty=0’ );
if(count($tt)):
$html.= (‘<li>’. $tax->attribute_label. ‘: ‘);
foreach($tt as $t) {
if($t->name ) $html.= $t->name.’, ‘;
#break;
}
$html = trim($html, ‘, ‘).'</li>’;
endif;
endif;
endforeach;
endif;
$html.='</ul>’;
echo $html;
}

How to Show Product Attributes to Product Page

with the above code will create a loop and get the product attributes, the code add_action( ‘woocommerce_before_add_to_cart_form’, ‘de_xuat_thuoctinh’ ); will HOOK on the add to product button in the product page, we can make the css more beautiful

For product pages that build their own product page or do not have “add to cart”, this version will not be displayed, we can find another place to hook it or you can add it by inserting a short as shown in the picture.

With the code pasted in the Function gives us a short [thongtin111], after pasting it will be like the picture!