Change Product Title when one of the Variations is picked

Hey,

I want Product Title to change when the individual Variation is being selected. I treat variations as individual products already, however, i want Product Title to change as well.

Hello,

Navigate to Theme Settings > Custom JS > Add the following code.

jQuery( document ).ready( function( $ ) {
    var title_text = $( '.product-type-variable .product_title' ).text(); // get default title
    function add_variation_txt_to_title() {
        var new_title_text = '';
        $( '.variations select' ).each( function() {
            new_title_text += ' ' + $( this ).find( ':selected' ).val(); // collect all variation selected <options>
        })
        $( '.product-type-variable .product_title' ).text( title_text + new_title_text ); // set new title
    }
    add_variation_txt_to_title(); // call on load
    $( '.variations select' ).change( function() { // call on <select >change 
        add_variation_txt_to_title();
    })
})

Best Regards.

Thanks!
You can close this one.

Most Welcome!!!.

I’m so happy to hear you are pleased with the Theme and Support. XTEMOS strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

We count ourselves lucky to have you as a customer. You can always reach us at any time. We are always here to help you.

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts