WooCommerce – how to display product category title above product category images?

1). Copy the Template File

Navigate to wp-content/plugins/woocommerce/templates/loop/
Find category.php

Copy it to your theme at wp-content/themes/your-theme/woocommerce/loop/category.php

2).Modify the category.php File
Open category.php in a code editor and update it to separate the title from the image:

<?php
/**
 * The template for displaying product category thumbnails within loops.
 */
if (!defined('ABSPATH')) {
    exit;
}

global $woocommerce_loop;
?>
<li <?php wc_product_cat_class('', $category); ?>>
    <h2 class="woocommerce-loop-category-title"><?php echo esc_html($category->name); ?></h2> <!-- Title before Image -->
    <a href="<?php echo esc_url(get_term_link($category, 'product_cat')); ?>">
        <?php do_action('woocommerce_before_subcategory_title', $category); ?>
    </a>
</li>

Solution 2: Use a Hook in functions.php
If you prefer not to override templates, you can modify WooCommerce behavior using a hook:

remove_action('woocommerce_before_subcategory_title', 'woocommerce_template_loop_category_title', 10);
add_action('woocommerce_before_subcategory', function ($category) {
    echo '<h2 class="woocommerce-loop-category-title">' . esc_html($category->name) . '</h2>';
}, 5);