# Pre-order products

Story can modify the add-to-cart button to let your customers know they are purchasing a pre-order item:

![](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FWzcJotGxL5U2Lhl4zQxQ%2FScreen%20Shot%202021-12-30%20at%208.35.19%20PM.png?alt=media\&token=4e2ae08e-711a-403b-9b3c-cfa82662e376)

## Quick setup for experienced users

The most important part of setting up this metafield is to use the namespace and key of:

```json
theme.preorder
```

See the example here:

![Namespace and key should changed to theme.preorder](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2F89nPCVgTbfOGoc8gimZT%2FScreen%20Shot%202021-12-30%20at%207.21.25%20PM.png?alt=media\&token=b5033e3b-cf33-4499-97dd-cb71fb3ba444)

The **Content type** should be set to **True or false**.

## Full detailed step-by-step setup

The first step is to define a custom metafield that Story theme supports.&#x20;

Start in your Shopify Admin -> Settings and choose Metafields from the left panel and then click on **Products** (click images to zoom):

![Under Metafields, click on Products ](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FySQSxOj5uNp6tB54amaY%2FScreen%20Shot%202021-11-19%20at%207.04.54%20PM.png?alt=media\&token=4ddd5df6-ba20-4cf0-98de-a29121d523c7) ![Use the Add definition button to begin](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FP75rdzL7FZqqdyMgnPmS%2FScreen%20Shot%202021-11-19%20at%207.26.03%20PM%20\(1\).png?alt=media\&token=4279b446-4060-4c41-ae38-1ed389fc302f)

Next,

* Click the Add definition button
* type-in "preorder" for the Name
* Change the Namespace and key from `my_fields` to `theme`. The namespace and key should now be: **theme.preorder**

![Change from my\_fields to theme](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FtPgyeVVIylbaIGQPNv7b%2FKapture%202021-12-30%20at%2019.32.40.gif?alt=media\&token=be1fd34e-819b-44cc-96ec-c025cb71e57d)

Change to:

{% hint style="success" %}
theme.preorder
{% endhint %}

Example:

![Don't skip this step](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2F89nPCVgTbfOGoc8gimZT%2FScreen%20Shot%202021-12-30%20at%207.21.25%20PM.png?alt=media\&token=b5033e3b-cf33-4499-97dd-cb71fb3ba444)

Add a description and choose **Select content type**.

&#x20;Choose **True or False**:

![Choose True or False for the Content type](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FcWHgTeESvDVsbLP6NhcJ%2FKapture%202021-12-30%20at%2019.35.52.gif?alt=media\&token=c54ea1a4-0b30-4320-8d9a-2da53ac349af)

**Save** your new product metafield. Now we can use this custom theme.preorder metafield with any of our products.&#x20;

### Product setup

{% hint style="success" %}
Now that our custom metafield has been defined, we can **easily** configure any of our products to be set as a pre-order product.&#x20;
{% endhint %}

The next and final step is to edit any of your products in the Shopify Admin -> Products and toggle the new preorder true or false metafield. Scroll to the bottom of the product setup page:

![](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FW0jSWRecoskHEJRgD3IT%2FKapture%202021-12-30%20at%2020.04.54.gif?alt=media\&token=fa49fd16-4bbb-4ae2-b61a-9f568aba53b0)

Products that are set to True will display a pre-order button on the product page:

![](https://3236268666-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJFe8gZiFPB3ohxgaTmnx%2Fuploads%2FWzcJotGxL5U2Lhl4zQxQ%2FScreen%20Shot%202021-12-30%20at%208.35.19%20PM.png?alt=media\&token=4e2ae08e-711a-403b-9b3c-cfa82662e376)

### Manually capture payments

Shopify recommends merchants manually capture payments for pre-orders. Here is an article from Shopify to help:\
<https://help.shopify.com/en/manual/orders/get-paid#capture-payments-manually>

Please contact Shopify Support regarding payment capture options and settings.&#x20;
