Adding Content To Top Of WooCommerce Product Tag Pages

Hello,

A couple weeks ago we submitted a support request to add the ability to add description content both above and below the block of product listing thumbnails on our custom 'product brand' pages. The catch was that we needed each content description to be unique for each page. In order to accomplish this, Adam Czajczyk was kind enough to provide the following code that we placed in our mu-plugin directory (see code snippet below):

-----------------------------
<?php
// new brand description above products
function action_woocommerce_archive_description( $woocommerce_taxonomy_archive_description ) {
$q_object = get_queried_object();
if (isset($q_object->taxonomy) && $q_object->taxonomy == 'brand':wink: {
$top_description = get_term_meta( $q_object->term_id, 'top-description', true );
echo '<div class="brand-top-description">' . $top_description . '</div>';
}
};
add_action( 'woocommerce_archive_description', 'action_woocommerce_archive_description', 10 );

# extend taxonomy form
add_action( 'brand_add_form_fields', 'add_topdescription_field', 10, 2 );
function add_topdescription_field($taxonomy) {
global $feature_groups;
?><div class="form-field term-group">
<label for="top-description">Top Description</label>
<textarea id="top-description" name="top-description"></textarea>
</div><?php
}
#save additional taxonomy field
add_action( 'created_brand', 'save_topdescription_meta', 10, 2 );
function save_topdescription_meta( $term_id, $tt_id ){
if( isset( $_POST['top-description'] ) && '' !== $_POST['top-description'] ){
$group = $_POST['top-description'];
add_term_meta( $term_id, 'top-description', $group, true );
}
}
#update additional taxonomy field
add_action( 'brand_edit_form_fields', 'edit_topdescription_field', 10, 2 );
function edit_topdescription_field( $term, $taxonomy ){
// get current data
$top_description = get_term_meta( $term->term_id, 'top-description', true );
?><tr class="form-field term-group-wrap">
<th scope="row"><label for="top-description">Top Description</label></th>
<td><textarea id="top-description" name="top-description"><?php echo $top_description; ?></textarea></td>
</tr><?php
}
add_action( 'edited_brand', 'update_topdescription_meta', 10, 2 );
function update_topdescription_meta( $term_id, $tt_id ){
if( isset( $_POST['top-description'] ) && '' !== $_POST['top-description'] ){
$group = $_POST['top-description'];
update_term_meta( $term_id, 'top-description', $group );
}
}
#display top-description on brands lista
add_filter('manage_edit-brand_columns', 'add_topdescription_column' );
function add_topdescription_column( $columns ){
$columns['top_description'] = 'Top Description';
return $columns;
}
add_filter('manage_brand_custom_column', 'add_topdescription_column_content', 10, 3 );
function add_topdescription_column_content( $content, $column_name, $term_id ){
if( $column_name !== 'top_description' ){
return $content;
}
$term_id = absint( $term_id );
$top_description = get_term_meta( $term_id, 'top-description', true );
if( !empty( $top_description ) ){
$content .= esc_attr( $top_description );
}
return $content;
}
------------------------------
This code created a second description box on the admin back end page editor which allowed us to have unique content above and below each brand page.

We would like our 'product tag' pages to have the same functionality so we can add content above the product listing thumbnails on product tag pages as well, just like the aforementioned brand pages. Could we somehow adjust the code already provided to include the ability to add a custom description on product tag pages as well?

Please see this link for an example of one of our brand pages:
https://cncmachines.net/brand/used-haas/

I realize this request may sound rather confusing so please let me know if I can do anything to make things clearer and thank you for any help you can offer in this matter!

Take care,
Matthew

  • Predrag Dubajic

    Hi Matthew,

    Hope you're doing well.

    As I understand, your previous request was about custom taxonomy and that's why it was more complex, the current one you are referring to is the default WooCommerce tag so it should be more easier to do it.

    For example, what you can do is create /woocommerce/ folder in your child theme, so you can customize WooCommerce templates.
    Now go to /plugin/woocommerce/templates/ and copy archive-product.php and taxonomy-product_tag.php, which you can then paste to your /themes/child_theme/woocommerce/ folder.

    What you need to do now is to rename archive-product.php in your child theme to archive-product-tag.php, and open taxonomy-product_tag.php where you need to also change archive-product.php to archive-product-tag.php in code.

    After that you can edit archive-product-tag.php in order to customzie Tag page template.

    Best regards,
    Predrag

  • Matthew

    Hi Predrag,

    Thanks for the response, hope you're doing well also.
    If I understand correctly, any changes/additions we made to the product tag template would be global changes to all product tag pages? Like our custom brand pages, we would want to have the ability to add/edit different content on each product tag page. Could we add a 'top description' html editor box to the admin back-end for product tag pages as well? This is what we did for the product brand pages using the code posted in my first message.
    Please check out these product brand pages to see how content in the 'top description' container (the buttons below the page header) is different for each page:
    https://cncmachines.net/brand/used-haas/
    https://cncmachines.net/brand/used-mazak/
    https://cncmachines.net/brand/used-okuma/

    I've also attached some screenshots to show what the brand pages look like on the back end with the text editor box. This is what we would like to have on our product tag pages as well so we can add/edit content below the header and above the product listings just like the brand pages. What would be the best way to accomplish this?

    Thanks again for your help,
    Matthew

  • Adam Czajczyk

    Hi Matthew

    I hope you're well today!

    Both are taxonomies in fact, with that exception that "brand" is a custom one. But because of this we can actually re-use the code that we created previously, only small changes would be necessary.

    1. Add this code somewhere below the code you already have for your brands (it will take care of back-end, adding that additional "Top description" field to WooCommerce tags as well):

    # extend woo tags form
    add_action( 'product_tag_add_form_fields', 'add_wootag_field', 10, 2 );
    function add_wootag_field($taxonomy) {
    	global $feature_groups;
    
    	?><div class="form-field term-group">
    		<label for="wootag-field">Top Description</label>
    		<textarea id="wootag-field" name="wootag-field"></textarea>
    	</div><?php
    }
    
    #save additional woo tags field
    add_action( 'created_product_tag', 'save_wootag_meta', 10, 2 );
    function save_wootag_meta( $term_id, $tt_id ){
    
    	if( isset( $_POST['wootag-field'] ) && '' !== $_POST['wootag-field'] ){
    		$group = $_POST['wootag-field'];
    		add_term_meta( $term_id, 'wootag-field', $group, true );
    	}
    
    }
    
    #update additional woo tags field
    add_action( 'product_tag_edit_form_fields', 'edit_wootag_field', 10, 2 );
    function edit_wootag_field( $term, $taxonomy ){
    	// get current data
    	$wootag = get_term_meta( $term->term_id, 'wootag-field', true );
    	?><tr class="form-field term-group-wrap">
    		<th scope="row"><label for="wootag-field">Top Description</label></th>
    		<td><textarea id="wootag-field" name="wootag-field"><?php echo $wootag; ?></textarea></td>
    	</tr><?php
    }
    
    add_action( 'edited_product_tag', 'update_wootag_meta', 10, 2 );
    function update_wootag_meta( $term_id, $tt_id ){
    
    	if( isset( $_POST['wootag-field'] ) && '' !== $_POST['wootag-field'] ){
    		$group = $_POST['wootag-field'];
    		update_term_meta( $term_id, 'wootag-field', $group );
    	}
    }
    
    #display woo tag additional desc on tags lista
    add_filter('manage_edit-product_tag_columns', 'add_wootag_column' );
    function add_wootag_column( $columns ){
    
    	$columns['top_description'] = 'Top Description';
    	return $columns;
    
    }
    
    add_filter('manage_product_tag_custom_column', 'add_wootag_column_content', 10, 3 );
    function add_wootag_column_content( $content, $column_name, $term_id ){
    
    	if( $column_name !== 'top_description' ){
    		return $content;
    	}
    
    	$term_id = absint( $term_id );
    	$top_description = get_term_meta( $term_id, 'wootag-field', true );
    
    	if( !empty( $top_description ) ){
    		$content .= esc_attr( $top_description );
    	}
    
    	return $content;
    }

    2. Find this (already existing) code there (it's at the very top):

    // new brand description above products
    function action_woocommerce_archive_description( $woocommerce_taxonomy_archive_description ) {
    $q_object = get_queried_object();
    if (isset($q_object->taxonomy) && $q_object->taxonomy == 'brand') {
    $top_description = get_term_meta( $q_object->term_id, 'top-description', true );
    echo '<div class="brand-top-description">' . $top_description . '</div>';
    }
    };
    add_action( 'woocommerce_archive_description', 'action_woocommerce_archive_description', 10 );

    and replace it with this one:

    // new brand and tags description above products
    function action_woocommerce_archive_description( $woocommerce_taxonomy_archive_description ) {
    	$q_object = get_queried_object();
    
    	if (isset($q_object->taxonomy) && $q_object->taxonomy == 'brand') {
    		$top_description = get_term_meta( $q_object->term_id, 'top-description', true );
    		echo '<div class="brand-top-description">' . $top_description . '</div>';
    	}
    	elseif (isset($q_object->taxonomy) && $q_object->taxonomy == 'product_tag') {
    		$top_description = get_term_meta( $q_object->term_id, 'wootag-field', true );
    		echo '<div class="brand-top-description">' . $top_description . '</div>';
    	}
    };
    add_action( 'woocommerce_archive_description', 'action_woocommerce_archive_description', 10 );

    That should do the trick. Give it a try please and let me know :slight_smile:

    Best regards,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.