How to Set Up a Pre-Order System on Shopify Without an App

How to Set Up a Pre-Order System on Shopify Without an App


Introduction

Want to offer pre-orders on your Shopify store but don’t want to rely on paid or bulky third-party apps? Good news: you can set up a fully functional pre-order system using Shopify's built-in features and a bit of theme customization. In this guide, you’ll learn how to do it—step-by-step.


What is a Pre-Order and Why Offer It?

A pre-order allows customers to purchase a product before it’s available or back in stock. This strategy is used to:

  • Validate demand before full production.

  • Keep cash flow running during restocks.

  • Create hype for upcoming products.

  • Reduce inventory risk.


Step-by-Step: Setting Up Pre-Orders Without an App


Step 1: Duplicate Your Product Template (Optional but Recommended)

To keep your regular products and pre-order products visually separate:

  1. Go to Online Store > Themes > Edit code.

  2. Duplicate product.liquid or main-product.liquid and rename it to product.preorder.liquid.

  3. Assign this template only to products you want to offer as pre-orders.


Step 2: Mark the Product as “Continue Selling When Out of Stock”

  1. Go to Products > Select your product.

  2. Scroll to the Inventory section.

  3. Check the box: Continue selling when out of stock.

  4. Save.

🔁 This allows customers to check out even if inventory is 0.


Step 3: Customize the “Add to Cart” Button

Change the "Add to Cart" button text to "Pre-Order Now" for clarity.

  1. Go to Online Store > Themes > Edit code.

  2. Open your product template (likely product-form.liquid, main-product.liquid, or similar).

  3. Locate the Add to Cart button:

    <button type="submit" name="add">Add to cart</button>
  4. Replace it with:

    <button type="submit" name="add"> {% if product.available %} Add to cart {% else %} Pre-Order Now {% endif %} </button>

Step 4: Add a Pre-Order Note or Badge

Use metafields or product description to add a line like:

Note: This item is available for pre-order. Expected shipping date: [insert date].

Alternatively, use a badge on the product image by editing product-card.liquid or product-grid-item.liquid.


Step 5: Communicate Pre-Order Details on Cart and Checkout Pages

Make sure customers know it’s a pre-order to reduce complaints:

  • Edit cart.liquid to include a notice like:

    {% if item.product.available == false %} <p>This is a pre-order item. Shipping starts on [date].</p> {% endif %}
  • Also add this to order confirmation emails via Settings > Notifications > Order Confirmation.


Bonus: Use Shopify Metafields for Dynamic Pre-Order Messaging

If you're comfortable, you can use Shopify Metafields to:

  • Add custom shipping dates

  • Add pre-order labels per product

Go to Settings > Custom data > Products, and create metafields like:

  • pre_order_message

  • expected_shipping_date

Then update your theme to display them dynamically.


Advantages of Going App-Free

  • No monthly fees

  • Lighter and faster store performance

  • Full control over pre-order messaging


Limitations

  • No automated shipping updates or reminders

  • Manual updates needed for shipping dates

  • Basic user experience (compared to paid apps)


Conclusion

You don’t need to install yet another app to offer pre-orders on Shopify. With simple tweaks in your theme and product settings, you can enable a clean and clear pre-order system for your customers. It’s budget-friendly and effective—especially for small to mid-sized stores.

Back to blog

Leave a comment

Please note, comments need to be approved before they are published.