Check-out our new look and give us some feedback!

How To Display Stock Status for Product Variations

Posted on by AJ Morris
Reading Time: < 1 minute

If you have products that tend to sell out, or that you typically sell in bulk, it might be beneficial to display the available product quantity. This can ensure your customers can order the quantity or volume they need.

Displaying your stock availability is as simple as adding a quick code snippet to your theme’s function.php.

<?php 
add_action( 'woocommerce_after_add_to_cart_form', 'dropdown_waitlist_label' );
function dropdown_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);
			$('#pa_size > option').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 ( false == variation.is_in_stock ) {
							$(this).text( variation.attributes.attribute_pa_size + '\u00A0\u00A0\u00A0–\u00A0\u00A0\u00A0\u00A0Out of Stock');
						}
						if ( variation.min_qty == 1 && variation.max_qty == 1 ) {
							$(this).text( variation.attributes.attribute_pa_size + '\u00A0\u00A0\u00A0–\u00A0\u00A0\u00A0\u00A01 left in stock' );
						}
					}
				}
			});
		});
	</script>";
}
view 

Happy customizing.

About the Author: AJ Morris

AJ Morris is the Product Innovation and Marketing Manager at iThemes. He’s been involved in the WordPress community for over a decade focusing on building, designing and launching WordPress websites and businesses.

Latest Articles

How to Edit Your DNS Hosts File

Read Article

How to Edit Your DNS Hosts File

Read Article

Microsoft Exchange Server Security Update

Read Article

How to Monitor Your Server in WHM

Read Article

How to Monitor Your Server in WHM

Read Article