I would like to ask how to remove < h1 class="page-title"> in the product page?

h1 page title

Here's my sample link: https://pwbackup.panelwallart.com/products/colorful-world-map-on-old-wall-canvas-prints-panel-wall-art/

It seems that two < h1> tags exist on product pages, the page title, and product title.

I'm using the Porto theme for my Woocommerce Site.

2 Answers 2


There are two ways of doing this - with hooks, or by overriding the WooCommerce template file in your Child theme. First, let's look at the file override:

Method 1 - File Override

From the WooCommerce plugin folder, copy the templates/single-product/title.php file, and paste it into your active theme under woocommerce/single-product/title.php

Then, simply change this line:

the_title( '<h1 itemprop="name" class="product_title entry-title">', '</h1>' );


the_title( '<h2 itemprop="name" class="product_title entry-title">', '</h2>' );

Method 2 – Using Hooks

We find in the template file content-single-product.php that the function we need to override is called woocommerce_template_single_title:

  * Hook: woocommerce_single_product_summary.
  * @hooked woocommerce_template_single_title - 5
  * @hooked woocommerce_template_single_rating - 10
  * ...

WooCommerce template functions are defined in includes/wc-template-functions.php, and this function looks like:

if ( ! function_exists( 'woocommerce_template_single_title' ) ) {

     * Output the product title.
    function woocommerce_template_single_title() {
        wc_get_template( 'single-product/title.php' );

What we're going to do is unhook that action, then hook in our own function - just add this code to your functions.php file and make any changes to the heading tags in the the_title() function:

remove_action( 'woocommerce_single_product_summary','woocommerce_template_single_title', 5 );
add_action('woocommerce_single_product_summary', 'your_custom_function_call', 5 );
function your_custom_function_call() {
     the_title( '<h2 class="product_title entry-title">', '</h2>' );

Thank you for the response!

I followed the first two methods, but it seems that the page title is still active on product pages. After looking for some files, I found out that there are actually "Seven" header file types (I chose 7 in my theme settings). I opened the file and found the culprit. Since I only want the extra h1 to be removed on the product page, I just put a condition in it.

     <? php if(!is_product()){  ?>
        <div class="text-center<?php echo ! $hide_title ? '' : ' d-none'; ?>">

            <h1 class="page-title<?php echo ! $sub_title ? '' : ' b-none'; ?>"><?php echo porto_strip_script_tags( $title ); ?></h1>

            if ( $sub_title ) :
                <p class="page-sub-title"><?php echo porto_strip_script_tags( $sub_title ); ?></p>
            <?php endif; ?>
        <?php } ?>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.