Pre-order for out-of-stock Product Variants

[Paul_magdas]

Let's say you have a product with 2 variants. When one variant reaches zero stock, I need it to continue to sell but switch to PreOrder on its own. It shouldn't affect the other variant. 
Do you have a solution to this? I tested some apps, but they treated the whole product as PreOrder when one of the variants' stock reached zero. 

[Dotsquares]

Hi @Paul_magdas,

That is a creative approach to continue the product sales. Here are some steps that can solve.

1. Set the product variants to continue selling when out of stock
In your Shopify Admin:

• Go to Products > [Your Product]
• For each variant, click Edit
• Check "Continue selling when out of stock"

This ensures the variant can be purchased even if inventory is 0.

2. Use custom Liquid in your theme to show "Pre-Order" only when the selected variant is out of stock
Modify your theme's product-form.liquid or main-product.liquid (depending on your theme structure).

Here’s a basic snippet to guide you:

<script>
document.addEventListener('DOMContentLoaded', function() {
const variantSelect = document.querySelector('select[name="id"]');
const addToCartBtn = document.querySelector('button[name="add"]');
const originalText = addToCartBtn.textContent;

function updateButtonText() {
const selectedVariantId = variantSelect.value;
const selectedVariant = {{ product.variants | json }}.find(v => v.id == selectedVariantId);

if (selectedVariant && selectedVariant.inventory_quantity <= 0 && selectedVariant.available) {
addToCartBtn.textContent = 'Pre-Order';
} else {
addToCartBtn.textContent = originalText;
}
}

variantSelect.addEventListener('change', updateButtonText);
updateButtonText(); // run on initial load
});
</script>

This script updates the Add to Cart button text based on the selected variant’s stock level.

Hope this will help. Let me know if you need more help.

Regards,

[Sandy--STOQ]

Hey, @Paul_magdas. We have this on STOQ - our app for preorders & back in stock alerts. Everything in STOQ is defined at the variant level - i.e. you can choose to say that only one variant should ever turn to preorder and the other one should not.

We also have another feature where you can set preorder/backorder for all products on your store, and exclude specific variants from ever being picked up to turn into preorder. Let me know if you have any questions or need help - happy to walk you through it!

[Jo_EarlyBird]

Hi @Paul_magdas, Josiah from Early Bird here. 👋🏻 We're one of the few Built-for-Shopify pre-order apps (Early Bird) that lets you run pre-order campaigns and capture coming soon/back-in-stock emails - all at a variant level. It'll auto toggle to capture pre-orders for you when a specific variant is sold out (while your in-stock ones will sell as normal).

I see Sandy from Stoq has already offered to walk you through the setup - we'll be here to guide you through the end-to-end process as well if you're looking for different pre-order app options. 🙂

Josiah