I'm building a Store selling garments using Size as the Product Modifier option and variation as the modifier Type so that each size has it's own SKU and Inventory.

My Size drop down looks like this on the product detail page:

  • Small
  • Medium
  • Large

Is it possible to add 'Out of Stock' or 'In Stock' to the select options depending on individual stock levels so the drop down looks like this:

  • Small - Out of Stock
  • Medium - In Stock
  • Large - In Stock

Thanks in advance

1 Answer 1


The main problem is that options don't always have a direct mapping to a stock level. For example, if your products have both "Size" and "Color", it doesn't make sense to say "Red is out of stock" - it depends on the size as well.

Generally the best way to solve this is using dynamic css variables. For example, simply add class="store_product_out_of_stock" to an element inside your product tag, and it will be displayed only when the selected combination is out of stock.

Alternatively, if all your products have exactly one modifier, you can use the {option_stock_level} variable inside the {modifier_options} loop. This is somewhat of a hidden feature, because generally it's not a good idea to hard code this if your products might have more than one modifier.

        <!-- the following variables are only available if
             your product has exactly one modifier -->
  • Legend! thanks for the quick response Adrian. I'm lucky with this one that the products will only have exactly one modifier. The option_stock_level tag works a treat :)
    – xenowebdev
    Dec 6, 2012 at 1:50
  • How does this work if there is more than one modifier? It seems to not work from the look of it.
    – Aaron
    Feb 23, 2015 at 13:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.