CODEWITHSUNDEEP
phpwordpresswoocommerceproducthtml-heading
Tilter69
Tilter69

Reputation: 53

Add product title heading tag for WooCommerce category archive pages

I'm looking to change heading tag for products displaying on product category page (from no heading tag to H2) but only on product category page.

I found 2 solutions, which work, however they also change heading tag for products displayed on other pages, which I don't want.

1. By changing heading tag in content-product.php file

It works, however that also changes products displayed in related products on a product page.

<div class="box-text <?php echo flatsome_product_box_text_class(); ?>">
    <?php
        do_action( 'woocommerce_before_shop_loop_item_title' );

        echo '<h2 class="title-wrapper" style="font-size: 100%">';
        do_action( 'woocommerce_shop_loop_item_title' );
        echo '</h2>';

2. By adding code in functions.php file for woocommerce-loop-product

It works, but it changes heading tag everywhere, even for products displayed on the home page.

remove_action( 'woocommerce_shop_loop_item_title','woocommerce_template_loop_product_title', 10 );
add_action('woocommerce_shop_loop_item_title', 'soChangeProductsTitle', 10 );
function soChangeProductsTitle() {
    echo '<h2 class="' . esc_attr( apply_filters( 'woocommerce_product_loop_title_classes', 'woocommerce-loop-product__title' ) ) . '">' . get_the_title() . '</h2>';
}

Maybe the first solution is the best and I just need then to add code in related.php file or in funtions.php file, for changes on heading tag don't apply on related products?

I never learned to code, I'm blocked here.

Upvotes: 3

Views: 2215

Answers (1)

LoicTheAztec
LoicTheAztec

Reputation: 253784

You can use the conditional tag is_product_category()as follow:

1. By changing heading tag in content-product.php file

<div class="box-text <?php echo flatsome_product_box_text_class(); ?>">
<?php
    do_action( 'woocommerce_before_shop_loop_item_title' );
    
    if( is_product_category() ) { 
        echo '<h2 class="title-wrapper" style="font-size: 100%">';
    }

    do_action( 'woocommerce_shop_loop_item_title' );

    if( is_product_category() ) {
         echo '</h2>';
    }

2. Or by adding code in functions.php file arround woocommerce_shop_loop_item_title hook

add_action('woocommerce_shop_loop_item_title', 'product_heading_title_on_category_archives', 1 );
function product_heading_title_on_category_archives() {
    if( is_product_category() ) { 
        remove_action( 'woocommerce_shop_loop_item_title','woocommerce_template_loop_product_title', 10 );
        add_action('woocommerce_shop_loop_item_title', 'change_product_heading_title', 10 );
    }
}
function change_product_heading_title() {
    echo '<h2 class="' . esc_attr( apply_filters( 'woocommerce_product_loop_title_classes', 'woocommerce-loop-product__title' ) ) . '">' . get_the_title() . '</h2>';
}

Upvotes: 2

Related Questions