I'm trying changing titles on Wordpress Woocommerce shop page depends on which variation I'm using.

I've found one solution which works perfectly on product pages. I'm stuck now and need to change a little bit the code that will work on shop page too.

Here is the code for the product page:

https://wordpress.org/support/topic/how-to-make-the-title-of-the-product-change-when-choosing-specific-variation/

It works perfectly, you can check the working code here: http://tattodivi.nhely.hu/product/flower-lily/

I need one more solution which works on Woocommerce shop page too in this link: http://tattodivi.nhely.hu/

If any of you can help me on this let me know. Thanks.

CodePudding user response：

The following code might work

jQuery('.products .variable-item').on('click', function(){
    if(jQuery(this).parent().hasClass('image-variable-wrapper')){
    var title_obj = jQuery(this).parent().parent().parent().parent().parent().find('.woocommerce-loop-product__title');

    if(typeof(title_obj.attr('data-title'))=='undefined'){
        title_obj.attr('data-title', title_obj.text());
    }

    title_obj.text(title_obj.data('title') ' - ' jQuery(this).data('value'));
    }
});

CodePudding user response：

This snippet will work only if you set default variation beforehand as its in the demo you provide.

//Remove default title 
remove_action('woocommerce_shop_loop_item_title','woocommerce_template_loop_product_title',10);
//Add custom title
add_action('woocommerce_shop_loop_item_title','custom_template_loop_product_title',10);

function theme_template_loop_product_title() {
    global $product;
    
    if($product->get_type() === 'variable'):
        $attributes = $product->get_default_attributes();
        if($attributes):
        $_title = array();
        foreach($attributes as $attribute):
            $_title[] .= $attribute.' ';
        endforeach;
        echo '<h2 >' . get_the_title() .' '. implode('',$_title).'</h2>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
        else:
            echo '<h2 >' . get_the_title() . '</h2>';
        endif;
    else:
    echo '<h2 >' . get_the_title() . '</h2>';    endif;
}