The WooCommerce category description is a good way to increase usability and improve SEO on your site. We can also show a custom category title which is a little more descriptive.
To do this, it’s good practise to start with something easy, get that working, and then build from there.
Show the WooCommerce category description
In the child theme, if it doesn’t already exist, create a woocommerce/ directory. Copy the template file from wp-content/plugins/woocommerce/templates/archive-product.php to wp-content/themes/[your-child-theme]/woocommerce/archive-product.php. Now we can edit that without changing any plugin files directly (which could get replaced on the next update).
In WooCommerce 2.0.0+, towards the top of the file you should see this:
<?php if ( apply_filters( 'woocommerce_show_page_title', true ) ) : ?> <h1 class="page-title"><?php woocommerce_page_title(); ?></h1> <?php endif; ?>
Below that code, add the following:
<?php //show category description $term_object = get_queried_object(); ?> <div class="woocommerce-category-description"> <div class="title"><?php echo $term_object->name; ?></div> <div class="description"><?php echo $term_object->description; ?></div> </div>
In wp-admin, go to Products > Categories and edit a category to make sure there is a description to display.
Save the archive-product.php file above and view your category. You should now see the description.
Display a custom title for WooCommerce product category pages
To do this we’ll use the excellent Advanced Custom Fields plugin. Install it if you haven’t already. Create a field group called “Product category title”. Add a field and call it “Category title”. The default is text, leave it as is.
Under “Location” change the rule to show this field group if Taxonomy Term is equal to product_cat and publish the field group:
In wp-admin, go back to Products > Category > [edit your category]. Now when you scroll down you should see your field. Enter your custom category name.
Then in your archive-product.php file, update the code you entered earlier to match this:
<?php //show custom title and category description $term_object = get_queried_object(); ?> <div class="woocommerce-category-description"> <div class="title"><?php echo the_field('category_title', 'product_cat_'.$term_object->term_id); ?></div> <div class="description"><?php echo $term_object->description; ?></div> </div>
You might also need to comment out the existing <h1 class=”page-title”> in that file, so you don’t end up with two titles.
That’s it! Just a few lines of code means you can now show your WooCommerce category description and a custom title.