How to Add Page Content Below WooCommerce Categories: A Beginner’s Guide

So, you want to add some extra zing to your WooCommerce category pages? Maybe you want to include a welcome message, display a brand story, or offer some helpful tips related to the products within that category. You’ve probably realized that by default, WooCommerce only shows the category image and description *above* the product grid. Fear not! We’re going to walk you through how to put page content *below* the WooCommerce categories in a way that’s easy to understand and won’t break your website.

Why would you want to do this? Let’s imagine a real-life scenario:

Imagine you sell handcrafted leather journals. On your “Journals” category page, you might want to add a section below the product listings explaining *why* leather journals are special, detail the ethical sourcing of your leather, or offer tips on choosing the right journal for different needs. This not only enhances the user experience but also improves your SEO, as search engines have more relevant Explore this article on How To Change Product Tab Headings In Woocommerce With Php content to crawl and index.

The benefits are clear:

• Improved User Experience: Provide valuable information right where your customers need it.
• Enhanced SEO: More relevant content helps search engines understand what your category page is about.
• Brand Building: Share your brand story and values directly on relevant category pages.
• Increased Conversions: Address potential customer questions and concerns, leading to more sales.

Method 1: Using Category Description & Customization

The simplest approach involves utilizing the category description field in WooCommerce and then customizing the theme’s template files to display this description *below* the products. This method is best when you have relatively short, descriptive content.

1. Add Content to the Category Description:

• Go to Products > Categories in your WordPress dashboard.
• Select the category you Check out this post: Youtube How To Install Woocommerce Into WordPress With Elementor want to modify.
• In the “Description” field, add your desired content. You can use basic HTML tags (like `

  `, ``, ``) for formatting. For instance:

Welcome to our collection of handcrafted leather journals! Each journal is made with ethically sourced leather and bound with durable stitching. Learn more about our commitment to quality and sustainability below.

Choosing the right journal depends on your needs. Are you a writer, an artist, or a traveler? Explore our guide to find the perfect fit.

2. Modify the `archive-product.php` Template File:

This is the key step! You’ll need to edit your theme’s `archive-product.php` file to move the category description display. Important: Always use a child theme to prevent your changes from being overwritten during theme updates.

• Create a Child Theme: If you don’t already have one, create a child theme for your current active theme. There are many plugins and tutorials available to guide you through this. This is crucial!
• Copy `archive-product.php`: Copy the `archive-product.php` file from your parent theme’s WooCommerce folder (usually `wp-content/themes/[your-theme]/woocommerce/archive-product.php`) into the WooCommerce folder of your child theme (e.g., `wp-content/themes/[your-child-theme]/woocommerce/archive-product.php`). If the woocommerce folder does not exist in your child theme, you will need to create it.
• Edit `archive-product.php`: Open the `archive-product.php` file in your child theme and look for the following code (or something similar):

 <?php /** 
Hook: woocommerce_before_main_content.
 
* @hooked woocommerce_output_content_wrapper - 10 (outputs opening tags for the content)
 
@hooked woocommerce_breadcrumb - 20
 
@hooked WC_Structured_Data::generate_website_data() - 30
 */ do_action( 'woocommerce_before_main_content' ); ?> 

<?php

/

* Hook: woocommerce_archive_description.

*

* @hooked woocommerce_taxonomy_archive_description – 10

* @hooked woocommerce_product_archive_description – 10

*/

do_action( ‘woocommerce_archive_description’ );

?>

<?php

if ( woocommerce_product_loop() ) {

woocommerce_product_loop_start();

if ( wc_get_loop_prop( ‘total’ ) ) {

while ( have_posts() ) {

the_post();

/

* Hook: woocommerce_shop_loop.

*/

do_action( ‘woocommerce_shop_loop’ );

wc_get_template_part( ‘content’, ‘product’ );

}

}

woocommerce_product_loop_end();

/

* Hook: woocommerce_after_shop_loop.

*

* @hooked woocommerce_pagination – 10

*/

do_action( ‘woocommerce_after_shop_loop’ );

} else {

/

* Hook: woocommerce_no_products_found.

*

* @hooked wc_no_products_found – 10

*/

do_action( ‘woocommerce_no_products_found’ );

}

Explore this article on How To Customize Woocommerce Product Schema

?>

• Move the `woocommerce_archive_description` Action: Cut the following line:

 <?php /** 
Hook: woocommerce_archive_description.
 
* @hooked woocommerce_taxonomy_archive_description - 10
 
@hooked woocommerce_product_archive_description - 10
 */ do_action( 'woocommerce_archive_description' ); ?> 

And paste it *below* the `woocommerce_after_shop_loop` action:

 /** 
Hook: woocommerce_after_shop_loop.
 
* @hooked woocommerce_pagination - 10
 */ do_action( 'woocommerce_after_shop_loop' ); 

<?php

/

* Hook: woocommerce_archive_description.

*

* @hooked woocommerce_taxonomy_archive_description – 10

* @hooked woocommerce_product_archive_description – 10

*/

do_action( ‘woocommerce_archive_description’ );

?>

• Save the File: Save your modified `archive-product.php` file.

Now, the category description will appear below the product grid.

Method 2: Using a Plugin

If you’re not comfortable editing theme files (and we understand!), you can use a plugin. Several plugins allow you to add custom content to WooCommerce category pages, often with more flexibility than just the category description field. Search the WordPress plugin repository for keywords like “woocommerce category content,” “woocommerce category description,” or “woocommerce category customization.” Many of these plugins have user-friendly interfaces and offer more advanced features like conditional display and custom layouts.

Some popular plugins include:

* Custom Category Pages: A popular choice for building completely custom category page layouts.

* WooCommerce Category Page Builder: Offers drag-and-drop functionality for creating unique category pages.

Example using a theoretical plugin (“WooCategoryContent”):

Let’s say you install a plugin called “WooCategoryContent.” After activation, you might find a new meta box on the category edit page (Products > Categories > Edit Category) labeled “Category Content.” This plugin might offer a WYSIWYG editor where you can add text, images, videos, and shortcodes.

1. Install and Activate the Plugin: Install the plugin from the Check out this post: How To Display Sidebar In Woocommerce Shop Page The7 Theme WordPress repository and activate it.

2. Navigate to Category Edit Page: Go to Products > Categories and edit the category you want to modify.

3. Use the Plugin’s Interface: Find the “Category Content” meta box (or whatever the plugin calls it) and add your content there.

4. Save the Category: Save your changes.

Method 3: Using Custom Fields & Theme Modification (For Advanced Users)

This method offers the most flexibility but requires a bit more technical skill. You can create custom fields for your categories using a plugin like Advanced Custom Fields (ACF) and then display these fields in your theme’s `archive-product.php` template.

1. Install and Configure Advanced Custom Fields (ACF):

• Install the ACF plugin.
• Create a new Field Group in ACF (ACF > Field Groups > Add New).
• Add a “WYSIWYG” field (or any other field type you need, like text, image, or video). Give it a name like “category_extra_content”.
• In the “Location” section of the Field Group, set the rule to show this field group on “Taxonomy Term” is equal to “Product Category”.

2. Populate the Custom Field:

• Go to Products > Categories and edit the category.
• You should see the new custom field you created with ACF. Add your content there.

Check out this post: How To Manually Post Woocommerce Product Pages To Facebook

3. Modify `archive-product.php` (in your child theme):

• Similar to Method 1, copy the `archive-product.php` from your parent theme to your child theme.
• Add the following code *below* the `woocommerce_after_shop_loop` action:

 <?php $category = get_queried_object(); $extra_content = get_field('category_extra_content', $category); 

if ($extra_content) {

echo ‘

‘;

echo $extra_content;

echo ‘

‘;

}

?>

4. Add Styling (Optional): Add CSS to your theme’s stylesheet (`style.css` in your child theme) to style the `category-extra-content` div.

This code retrieves the value of the `category_extra_content` custom field for the current category and displays it in a `div`. You can customize the HTML and CSS to match your website’s design.

Choosing the Right Method

• Short Content, Simple Formatting: Method 1 (Category Description) is best.
• Need More Flexibility, but Avoid Coding: Method 2 (Plugin) is the way to go.
• Complete Control, Complex Content: Method 3 (ACF & Theme Modification) is your best option.

Important Reminders:

• Child Theme: Always use a child theme when modifying theme files.
• Backup: Before making any changes to your theme files, create a backup of your website. This will save you if something goes wrong.
• Testing: Test your changes thoroughly on a staging environment before applying them to your live website.
• Caching: Clear your website’s cache after making changes to ensure the updates are visible.
• Plugin Compatibility: Check for compatibility between any plugins you use.