title: How to change product Image when variables are selected in Shop and Archive Pages?
body: <p>I use this hook to show variations on the shop page. However, the product image does not change when a variable is selected. It works on a Single product page. New to WordPress and PHP, I have thought woocommerce hooks work like a &quot;copy and paste&quot;. Why is it not working for the shop page? How can it work for the shop page?</p>
  <pre><code>add_action( 'woocommerce_before_shop_loop', 'show_production_variations_on_shop_page' );
  function show_production_variations_on_shop_page() {
  
  remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );
  add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_single_add_to_cart', 30 );
  }
  </code></pre>
  <p><a href="https://i.stack.imgur.com/Ssuuz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ssuuz.png" alt="enter image description here" /></a></p>