Add a Span Around a Product Title in WooCommerce

1 Views

I’m customizing a custom theme to use WooCommerce. One of the issues I’ve run into is adding a span tag around a product title on the single product page. I’ve figured out how to add a filter to the the_title method but unfortunately that method is used in other places like in the product image alt tag (which breaks it).

Is there a way to specify to only modify the_title when it is printing the main title to the page instead of being used elsewhere like an image attribute?

Read More

Here’s what I have so far: 

function my_product_title($title, $id)
{
    if(in_the_loop() && is_product())
    {
        return '<span class="border">FooBar</span>';
    }
    return $title;
}
add_filter( 'the_title', 'my_product_title', 5, 2);

Shouldn’t there be a way to hook up to the woocommerce_product_title filter? I’ve tried to do so unsuccesfully.

In the mean time I know I can modify the single-product/title.php template file but I would rather achieve this with actions or filters.

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. Here is how you do it,

    First remove woocommerce single title action, and create your own function to handle the title, later add back the action using your newly created function.

    <?php

remove_action('woocommerce_single_product_summary','woocommerce_template_single_title',5);
add_action('woocommerce_single_product_summary', 'woocommerce_my_single_title',5);

if ( ! function_exists( 'woocommerce_my_single_title' ) ) {
   function woocommerce_my_single_title() {
?>
            <h1 itemprop="name" class="product_title entry-title"><span><?php the_title(); ?></span></h1>
<?php
    }
}

?>