I’ve been working on my WooCommerce store, and I’m running into a frustrating issue with variable products.
On product pages with color and size variations, changing the selection doesn’t update the “Add to Cart” button state or URL. Even though the price and images swap correctly, the button still reads “Select options” and points to the parent product instead of the specific variation. That means customers can’t add the chosen variation directly to their cart.
Relevant snippet from my variable.php override
<?php defined( 'ABSPATH' ) || exit; global $product; $attribute_keys = array_keys( $attributes ); ?> <?php do_action( 'woocommerce_before_variations_form' ); ?> <?php if ( empty( $available_variations ) && false !== $available_variations ) : ?><p class="stock out-of-stock">This product is currently out of stock and unavailable.</p>
<?php else : ?>
<table class="variations" cellspacing="0">
<?php foreach ( $attributes as $attribute_name => $options ) : ?>
<tr>
<td class="label"><label for="<?php echo esc_attr( sanitize_title( $attribute_name ) ); ?>"><?php echo wc_attribute_label( $attribute_name ); ?></label></td>
<td class="value">
<?php
wc_dropdown_variation_attribute_options( [
'options' => $options,
'attribute' => $attribute_name,
'product' => $product,
] );
?>
</td>
</tr>
<?php endforeach; ?>
</table>
<div class="single_variation_wrap">
<?php
do_action( 'woocommerce_before_single_variation' );
do_action( 'woocommerce_single_variation' );
do_action( 'woocommerce_after_single_variation' );
?>
</div>
<?php endif; ?>
<?php do_action( 'woocommerce_after_variations_form' ); ?>
Are there hooks or filters I can add to explicitly re-enqueue or re-trigger the variation scripts only on my custom template? If you’ve fixed it by adjusting your functions.php
, could you share a minimal example?
Any pointers or code snippets would be appreciated. Thank you.
(Admin Edit: Removed the link to the store, as I’m not sure whether this is spam or not, as it has nothing to do with Exercism )