5/5

WooCommerce Profit Reports
Like You've Never Seen Before

Adding Tags To Your Product Page Is Great For Adding Easy To Consume Data

By default Woocommerce will display your tags, but maybe you want to put them somewhere else or process them a little differently.

Here’s how you get them on your product page. 

Note, I am going to print them above my add to cart form, but you may want to print them elsewhere.

For a guide on where to print your tags you can refer to this product page hook guide by Business Bloomer.

We are going to place the following snippet in our functions.php

The Snippet (in functions.php)

/**
 *
 *	Add Product Tags Above The Add To Cart Form
 *
 */
add_action( 'woocommerce_before_add_to_cart_form', 'dwc_print_tags_under_description' );
function dwc_print_tags_under_description() {

	// This will hold all of our product tags
	$tags = array();

	// get an array of the WP_Term objects for a defined product ID (get_the_id() will return the product id of the current object)
	$terms = wp_get_post_terms( get_the_id(), 'product_tag' );

	// Loop through each product tag for the current product
	if ( count( $terms ) > 0 ) {

	    foreach( $terms as $term ) {

	        $term_name = $term->name;

	        // Set the product tag names in an array
	        $tags[] = '<span class="product-tag-badge">' . $term_name . '</span>';

	    }

	    // Combine all of the product tags into one string for output
	    $tags = implode( '', $tags );

	    // Output
	    echo $tags;
	}

}

A Quick Bit Of Styling

span.product-tag-badge {
    border-radius: 3px;
    background: #f7f7f7;
    padding: 5px 10px;
    box-shadow: 0px 2px 2px 0px #e3e3e3;
    font-size: 11px;
    margin: 5px;
    display: inline-block;
    line-height: initial;
    min-width: 60px;
    text-align: center;
}

Would You Prefer The Product Tags To Have Links?

/**
 *
 *	Add Product Tags Above The Add To Cart Form
 *
 */
add_action( 'woocommerce_before_add_to_cart_form', 'dwc_print_tags_under_description' );
function dwc_print_tags_under_description() {

	// This will hold all of our product tags
	$tags = array();

	// get an array of the WP_Term objects for a defined product ID (get_the_id() will return the product id of the current object)
	$terms = wp_get_post_terms( get_the_id(), 'product_tag' );

	// Loop through each product tag for the current product
	if ( count( $terms ) > 0 ) {

	    foreach( $terms as $term ) {

	    	// Product Tag Name
	        $term_name = $term->name;

	        // Product Tag Link
	        $term_link = get_term_link( $term, 'product_tag' );

	        // Set the product tag names in an array
	        $tags[] = '<a class="product-tag-badge" href="'.$term_link.'">' . $term_name . '</a>';

	    }

	    // Combine all of the product tags into one string for output
	    $tags = implode( '', $tags );

	    // Output
	    echo $tags;
	}

}

Related Post

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments

Recent Posts