Skip to content

Instantly share code, notes, and snippets.

@lawkwok
Created March 10, 2017 20:56
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lawkwok/c0ba8696df633731ca0abf12fc640248 to your computer and use it in GitHub Desktop.
Save lawkwok/c0ba8696df633731ca0abf12fc640248 to your computer and use it in GitHub Desktop.
Adds .outofstock class to WooCommerce variation input tag
add_action( 'woocommerce_after_add_to_cart_form', 'radio_waitlist_label' );
function radio_waitlist_label() {
echo "
<script>
jQuery(document).ready(function($) {
var variation_data = $('form.variations_form').attr('data-product_variations');
var variation_data = JSON.parse(variation_data);
$('.variations td.value div input').each(function() {
for (var i = 0; i < variation_data.length; i++) {
var variation = variation_data[i];
if ($(this).val() == variation.attributes.attribute_pa_size) {
if ( variation.is_in_stock == false ) {
$(this).addClass('outofstock');
}
}
}
});
});
</script>";
}
@lawkwok
Copy link
Author

lawkwok commented Mar 10, 2017

Works with this plugin https://en-ca.wordpress.org/plugins/wc-variations-radio-buttons/

Just style the labels after the .outofstock class. E.g.

.outofstock + label {
    text-decoration: line-through;
    color: #ddd;   
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment