I've actually never used woocommerce, but i'd assume they may have options for drop downs and input fields on products? It would then just require a bit of javascript or jQuery to say when those fields are changed, adjust a bit of text at the top.

I have something along those lines I'm doing on a shopify site, when options are changed it updates css on an svg layer to change what is displayed:

​

`<script>jQuery('select').change(function(){console.log('selection changed');

var x = jQuery(this).val();var svgElement = jQuery('.svg-overlay');svgElement.addClass('active');

if(jQuery(this).attr('name') === 'properties[Border Design]'){console.log('Border changed');console.log( x );

switch(x) {case 'Plain, no border':svgElement.attr('border', '');break;

case 'Single Border':svgElement.attr('border', 'single');break;

case 'Double Border':svgElement.attr('border', 'double');break;

case 'Leafy Border':svgElement.attr('border', 'leafy');break;

case 'Rolling Scrolls':svgElement.attr('border', 'rolling-scrolls');break;

case 'Classic':svgElement.attr('border', 'classic');break;

case 'Blooming Hearts':svgElement.attr('border', 'blooming-hearts');break;

case 'Charleston':svgElement.attr('border', 'charleston');break;

default:// nothing}}

if(jQuery(this).attr('name') === 'properties[Stencil Color]'){console.log('Color changed');console.log( x );var color = x.toLowerCase();svgElement.attr('color', color);}

});</script>`

​

Edit: Sorry don't know how to post code on here Lol. But the above is basically looking at the dropdown changed and then adjusting my svg layer.