Latest

Pre-orders

Replace the add-to-cart button with a pre-order button using metafields

Pipeline can display a "Pre-order" button on any of your products without having to create a custom product template. We use a metafield that you can define easily and then start using the feature. Simply toggle on/off any product that needs to display the "Pre-order" button.

On the main product page, the Add to Cart button is replaced with a Pre-order button:

How to

There are a few basic steps to set up and start using the pre-order feature. Here is a quick summary of the steps:

Basic steps

  1. Using the Shopify Admin under Settings, define a product metafield. The Content type is True or false.

  2. In the Product Setup, toggle the setting to true for any product you wish to display the "Preorder" button.

  3. Under Shopify Admin -> Payments, ensure your store can Manually capture payment

Step 1

In the Shopify Admin -> Settings -> Custom data, choose Products:

  • Use the "Add definition" button to create a new product definition

  • For the Name, use "preorder" or "Preorder" (no hyphen/dash)

  • Change the Namespace and key from custom.preorder to theme.preorder (important):

  • Verify that you've changed to theme.preorder

  • Add an optional description

  • Click on Select type, type in "true", and then choose "True or false":

  • Verify that your settings look like the following:

  • Use the Save button to complete.

Step 2

Now your can toggle on/off the setting on any of your products (the fun part).

  • Under the Shopify Admin -> Products, choose a product.

  • Scroll to the bottom of the product setup, and to the Metafields section, here you'll find the new Preorder field.

  • Toggle On to make that product display a "Pre-order" button on the product detail page.

Step 3

Shopify recommends that you manually capture payments if selling products that are not ready to ship. Contact Shopify Support for any assistance with your Payments setup. Here is a support article from Shopify:

Bonus setup

You can add a custom product badge called "Pre-Order" to display on your collection pages or any section that used the Product Card:

Follow our instructions on how to create a custom badge in Pipeline to easily add this feature:

pageBadges / Stickers

Last updated