How can I change 'add to cart' to 'pre-order' on my product pages?

Technical Q&A

Topic summary

Goal: show “Pre-order” instead of “Add to cart” on product tiles (collection pages) in the Refresh theme; current Vertex app only changes the button on the product detail page.

Key guidance:

  • No built-in setting for collection page pre-order display in Refresh. Requires editing theme code (Online Store → Themes → Edit code).
  • Modify product card/snippet templates to add conditional logic that checks inventory/stock status, then replace the button text from “Add to cart” to “Pre-order.”
  • Reference provided: Shopify’s theme customization guide link.

Trade-offs:

  • Theme customization needs coding familiarity and may require maintenance after theme updates.

Alternative solution:

  • Use a dedicated app (e.g., K1 PreOrder) that automatically replaces buttons on collection pages, adds pre-order badges on tiles, and supports inventory-based modes compatible with Refresh. App listing link provided.

Status:

  • No resolution yet; options presented (custom code vs. app). Assistance offered for theme customization if needed.
Summarized with AI on January 14. AI used: gpt-5.
1

Hi, I am currently using the refresh theme for my site. I have some products that i am taking pre-orders for. I am using an app (vertex) that changes the add to cart button to pre-order when you go into the description which is fine. I want the product item to show pre-order instead of add to cart before you click on it ?? hope this make sense ?

Paul