# Checkout fields

URL: https://docs.sparklayer.io/help/ordering/checkout-fields

Collect extra details at checkout, such as a PO number, delivery date or file, with standard and custom checkout fields, and see where the data is saved.

> **Quick summary**
>
> - Checkout fields collect extra details on the **Details** step of the [My Cart](https://docs.sparklayer.io/help/storefront/interfaces/my-cart.md), such as a PO number, delivery date or delivery instructions.
> - **Standard fields** (**Customer Reference**, **PO Number**, **Requested Shipping Date**) save to set, searchable places on the order. **Custom fields** are your own and save as order notes.
> - Add both without code with **Add field** at **Storefront > Options > Checkout** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options > Checkout** in the Shopify app. Standard fields need Core Script 4.7.0 or later; custom fields work on any version. File uploads, validation rules and other options need a developer.
> - File uploads need the Growth plan or above. On Wix, a developer adds custom fields in code, with `checkoutCustomElements`.

## How it works

What happens to checkout field data:

1. **Customer fills in the field**: On the Details step of the checkout
2. **Saved with the order**: Standard fields go to set places; custom fields are saved as order notes
3. **Shown to you and the customer**: In your platform's order admin and the customer's My Account
4. **Used elsewhere**: On invoices and packing slips, in automations, or sent to your ERP through the API

| Kind | How it's identified | Where the data goes | Use it for |
| --- | --- | --- | --- |
| **Standard field** | A fixed `id` that SparkLayer recognises | A structured place on the order, such as Shopify's own PO number field. You can search and filter by it, and use it in your theme and template editor. | Customer references, purchase order (PO) numbers and requested shipping dates |
| **Custom field** | A `name` you choose | The order's notes (on Shopify, **Additional details**) | Anything else, such as delivery instructions, a tax ID or a confirmation tick box |

Checkout fields are separate from **Additional Information**, the single free-text box at checkout. See [Cart and checkout](https://docs.sparklayer.io/help/ordering/cart-and-checkout.md#set-up-the-additional-information-field-po-number).

### What you can do without code

| Task | Where | Who does it |
| --- | --- | --- |
| Add the standard fields | **Add field** at **Storefront > Options > Checkout** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options > Checkout** in the Shopify app (Core Script 4.7.0 or later) | You |
| Add your own custom field | **Add field** at **Storefront > Options > Checkout** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options > Checkout** in the Shopify app | You |
| Add a file upload field, a validation rule (such as no weekend delivery dates) or any other option | Your [Core Script](https://docs.sparklayer.io/help/glossary.md#core-script), the SparkLayer code in your theme, with `checkoutCustomElements` | Your developer or agency |

## Turn on standard checkout fields

Standard fields need Core Script 4.7.0 or later: check **Version for this store** at **Storefront > Widgets > Core script version** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/configuration/frontend/core)), or **SparkLayer Wholesale > Storefront > Widgets > Core script version** in the Shopify app.

1. Go to **Storefront > Options** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options** in the Shopify app and open **Checkout**.
2. Next to **Checkout fields**, click **Add field** and choose a standard field. Set whether it's shown, optional or hidden.
3. Repeat for each standard field you want.
4. Click **Save and publish**. See [Storefront options](https://docs.sparklayer.io/help/storefront/storefront-options.md).

**Core Script code for your developer**

For more control, a developer can add standard fields to the Core Script by `id`. The `id` must match exactly, or SparkLayer won't recognise the field.

| Field | Field ID |
| --- | --- |
| Customer Reference | `customer-reference` |
| PO Number | `po-number` |
| Requested Shipping Date | `shipping-requested-date` |

```javascript title="Core Script"
checkoutCustomElements: [
  { id: "customer-reference" },
  { id: "shipping-requested-date" },
  { id: "po-number" },
],
```

Standard fields take the same `attributes` and `onChange` keys as custom fields (see [Custom field settings](#custom-field-settings)). For example, to make the customer reference required:

```javascript title="Core Script"
checkoutCustomElements: [
  {
    id: "customer-reference",
    attributes: {
      required: true,
    },
  },
],
```

### Where standard fields appear in your orders

**Shopify only:**

On Shopify, standard fields are saved here:

| Field | Where it's saved |
| --- | --- |
| **PO Number** | Shopify's own PO number field on the order, shown as a **PO number** column in your orders and draft orders lists. |
| **Requested Shipping Date** | A dedicated custom field on the order, shown as `sparkShippingRequestedDate`. |
| **Customer Reference** | The Shopify order notes field. |

Your theme and template editor can use these fields, so you can show them on documents such as [invoices](https://docs.sparklayer.io/help/ordering/invoices.md). Customers see them on the order's **Summary** in [My Account](https://docs.sparklayer.io/help/storefront/interfaces/my-account.md).

In the order and activity views, you can:

- Search by Customer Reference
- Search by PO Number
- Filter by Requested Shipping Date, using a date range 

## Add a custom checkout field

A custom field is one you design, such as a delivery instructions box, a tax ID or a confirmation tick box. To add one without code:

1. Go to **Storefront > Options** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options** in the Shopify app and open **Checkout**.
2. Next to **Checkout fields**, click **Add field** and fill in the field's details. 
3. Click **Save and publish**.
4. Check the **Details** step of the checkout on your store.

**Shopify only:**

On Shopify, you can show a field only to customers with a particular tag: see [B2B-only content](https://docs.sparklayer.io/help/platforms/shopify/customisations/b2b-only-content.md).

For validation rules, grouped drop-down menus and every other option, your developer can [add the field in the Core Script](#add-a-custom-field-in-the-core-script-for-developers).

### Where custom field data is saved

Custom field answers are saved to the order as notes.

| Where | What you see |
| --- | --- |
| **Shopify order** | The **Notes** card, under **Additional details**, beside SparkLayer's own details such as `sparkCartId` and `sparkPaymentType`. Shopify calls these **custom attributes**. |
| **Customer's My Account** | The order's **Additional Information**, for example "Preferred Shipping Date: 2024-12-02". |

**Shopify only:**

On Shopify, custom attributes can also:

- Show on packing slips and [email notifications](https://docs.sparklayer.io/help/platforms/shopify/customisations/email-notifications.md)
- Go to a backend system through the [API](https://docs.sparklayer.io/developers/api.md)
- Trigger [Shopify Flow](https://apps.shopify.com/flow) workflows (see our [ready-made Shopify Flow templates](https://docs.sparklayer.io/help/platforms/shopify/customisations/flow.md))

Some third-party invoicing apps can show **Additional details** too; check with the app's developer. To show answers on SparkLayer invoices, see [Content Zones](https://docs.sparklayer.io/help/ordering/invoices.md#add-checkout-field-data-to-an-invoice).

## Let customers upload files at checkout

A file upload field lets B2B customers attach files to the order at checkout, such as a purchase order or order-specific details. It needs the Growth, Pro or Enterprise plan: to change plan, go to **Plan card** in the SparkLayer Dashboard, or **SparkLayer Wholesale > Plan** in the Shopify app or see [SparkLayer plans and pricing](https://www.sparklayer.io/pricing/).

Your developer adds the field in the Core Script:

1. Add the sample below to your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting), inside `checkoutCustomElements`.
2. Change the settings in `attributes` to suit.
3. Edit `translations` to change the text customers see.

**Core Script code and settings for your developer**

```javascript title="Core Script"
checkoutCustomElements: [
	{
		translations: {
			en: {
				title: "File Upload",
				detail: "Files must not be larger than 10MB. You can upload between 1 and 4 files"
			},
		},
		name: "file-upload",
		attributes: {
			type: "file",
			required: false,   // Optional. Default: false
			minlength: 1,     // Optional. Default: 1
			maxlength: 4,     // Optional. Default: 20
			maxsize: '10MB',  // Optional. Default: 20MB, Must be a number followed by `B`, `KB` or `MB`
			fileextensions: [ // Optional. Default: ['txt', 'csv', 'pdf', 'json', 'png', 'jpeg', 'gif', 'webp', 'svg', 'psd', 'xls', 'xlsx', 'ods', 'fods', 'ppt', 'pptx', 'odp', 'fodp', 'doc', 'docx', 'odt', 'fodt']
			  'png',
			  'txt',
			  'pdf',
			  'xls'
			]
		}
	}
],
```

| Setting | What it does |
| --- | --- |
| `required` | Set to `true` to make the customer upload a file. Default: `false`. |
| `minlength` | The **minimum** number of files the customer must upload. For example, `1` means at least 1 file. Default: `1`. |
| `maxlength` | The **maximum** number of files the customer can upload. For example, `4` stops them uploading more than 4. Default: `20`. |
| `maxsize` | The largest file size allowed, as a number followed by `B`, `KB` or `MB` (for example, `10MB`). The default and maximum is 20MB; you can set a lower limit but not a higher one. |
| `fileextensions` | The file types customers can upload. By default, all of these are allowed: `['txt', 'csv', 'pdf', 'json', 'png', 'jpeg', 'gif', 'webp', 'svg', 'psd', 'xls', 'xlsx', 'ods', 'fods', 'ppt', 'pptx', 'odp', 'fodp', 'doc', 'docx', 'odt', 'fodt']` |
| `translations` | The text customers see: the field `title` and the `detail` helper text. |

Customers then see a **File Upload** field on the **Details** step, and their files appear on the order in [My Account](https://docs.sparklayer.io/help/storefront/interfaces/my-account.md), under **Attachments**.

**What customers see**

The field has a **Choose file** button and helper text, such as the size limit and number of files allowed. Chosen files are listed above the button, and customers can remove one before continuing.

Under **Attachments**, each file shows its **File name** and **Assignment** (**Order-level** for checkout uploads), with an **Actions** menu to download it.

### Download uploaded files

There are 3 ways to get a file a customer uploaded:

| Who | How |
| --- | --- |
| **The customer** | Signs in and downloads the attachment from the order. |
| **A sales agent** | Signs in on the customer's behalf with [sales agent ordering](https://docs.sparklayer.io/help/sales-ordering/order-for-a-customer.md), opens the order and downloads the attachment. |
| **The API** | The [SparkLayer Files API](https://docs.sparklayer.io/developers/api/files.md) links uploads to the order data, so they can go to a back-office system such as an ERP. For help, contact our [support team](https://docs.sparklayer.io/help/support.md). |

**Shopify only:**

On Shopify, the order lists uploads in **Additional details** under `file-upload` (or your field's `name`). These are file references (`gid://sparklayer/File/...`) that can't be opened from Shopify.

For other platforms, see the [developer docs](https://docs.sparklayer.io/developers.md).

## Let customers upload files on the product page

Line-item uploads let customers attach a file to a specific product, such as a logo or name customisation. This advanced setup needs a developer: see [Let customers upload a file](https://docs.sparklayer.io/developers/javascript-sdk/cart.md#let-customers-upload-a-file) in the JavaScript SDK docs.

How product-level file uploads work once set up:

1. **Product page**: One or more upload fields, each with its own label (such as Front Design) and a Choose file button
2. **Cart**: Each file is shown under the product line, for example Front Design: "logo.png"
3. **My Account**: The files appear on the order under Attachments, assigned to the product's SKU

You can combine product-level and [checkout-level](#file-upload-file-attachments) uploads, such as a logo per product plus a purchase order for the whole order. All files appear on the order in My Account.

## Move to the standard fields

If your developer set up a customer reference or shipping date in the Core Script the older way, switch to the standard fields to get structured storage, search and filtering.

| If your Core Script has | Replace it with |
| --- | --- |
| The **Additional Information** field with `customerReferenceHidden` and `customerReferenceRequired` | The standard field `{ id: "customer-reference" }` |
| A shipping date custom field with a `name`, such as `my-shipping-requested-date` | The standard field `{ id: "shipping-requested-date" }` |

**Before and after code for your developer**

**Customer reference.** If you used the **Additional Information** field with the `customerReferenceHidden` and `customerReferenceRequired` display settings, like this:

```javascript title="Core Script"
display: {
  customerReferenceHidden: false,
  customerReferenceRequired: true,
},
```

replace it with the standard field:

```javascript title="Core Script"
checkoutCustomElements: [
  {
    id: "customer-reference",
    attributes: {
      required: true,
    },
  },
],
```

**Requested shipping date.** If you added a shipping date as a custom field with a `name`, like this:

```javascript title="Core Script"
checkoutCustomElements: [
  { name: "my-shipping-requested-date" },
],
```

switch it to the standard `id`:

```javascript title="Core Script"
checkoutCustomElements: [
  { id: "shipping-requested-date" },
],
```

The `id` must be `shipping-requested-date`. A custom field's `name` can be anything you choose; using the standard `id` is what turns on the structured storage, search and filtering.

## Add a custom field in the Core Script (for developers)

The Core Script gives every option for a custom field, such as validation rules and grouped drop-down menus. It's a theme code change, so pass this section to your developer or agency if you don't edit your theme.

1. Add a `checkoutCustomElements` array to your [Core Script](https://docs.sparklayer.io/help/storefront/storefront-options.md#add-a-core-script-setting) (or add to it if it's already there).
2. Add one object per field, with a `name`, `translations` (the text customers see) and `attributes` (the field type and validation). See [Custom field settings](#custom-field-settings).
3. Save your theme and check the **Details** step of the checkout.

This example adds a required delivery date field:

```javascript title="Core Script"
checkoutCustomElements: [
  {
    name: "delivery-date",
    translations: {
      en: {
        title: "Delivery Date",
        detail:  "Delivery unavailable on weekends."
      }
    },
    attributes: {
      required: true,
      type: "date"
    }
  },
],
```

One array can hold several fields. This example shows most of the [supported field types](#supported-field-types):

**Example with multiple custom fields**

```javascript title="Core Script"
checkoutCustomElements: [
{
  translations: {
      en: {
          title: "Text field",
          detail: "Explains what the field is for. Must be 2 letters followed by 2-4 digits"
      }
  },
  name: "text-field",
  attributes: {
      required: true,
      type: "text",
      placeholder: "Placeholder shows inside the empty input",
      minlength: 4,
      maxlength: 6,
      pattern: "[a-zA-Z]{2}[0-9]{2,4}"
  }
},
{
  translations: {
      en: {
          title: "Number field",
      }
  },
  name: "number-field",
  attributes: {
      type: "number",
      step: 5,
      min: 15,
      max: 25,
  }
},
{
  translations: {
      en: {
          title: "Date field",
      }
  },
  name: "date-field",
  attributes: {
      type: "date"
  }
},
{
  translations: {
      en: {
          title: "Time field",
      }
  },
  name: "time-field",
  attributes: {
      type: "time"
  }
},
{
  translations: {
      en: {
          title: "Week field",
      }
  },
  name: "week-field",
  attributes: {
      type: "week"
  }
},
{
  translations: {
      en: {
          title: "Datetime field",
      }
  },
  name: "datetime-field",
  attributes: {
      type: "datetime-local"
  }
},
{
  translations: {
      en: {
          title: "Checkbox field",
      }
  },
  name: "checkbox-field",
  attributes: {
      type: "checkbox"
  }
},
{
  translations: {
      en: {
          title: "Month field",
      }
  },
  name: "month-field",
  attributes: {
      type: "month"
  }
},
{
  translations: {
      en: {
          title: "Telephone field",
      }
  },
  name: "telephone-field",
  attributes: {
      type: "tel"
  }
},
{
  translations: {
      en: {
          title: "Email field",
      }
  },
  name: "email-field",
  attributes: {
      type: "email"
  }
},
{
  translations: {
      en: {
          title: "URL field",
      }
  },
  name: "url-field",
  attributes: {
      type: "url"
  }
},
],
```

### Example fields

Copy one of these into your Core Script, or send it to your developer, and adjust it to suit.

**Date picker, e.g. 'Shipping date'**

```javascript title="Core Script"
checkoutCustomElements: [
  {
    name: "shipping-date",
    translations: {
      en: {
        title: "Shipping Date",
        detail:  "Please select your preferred shipping date"
      }
    },
    attributes: {
      required: true,
      type: "date"
    }
  },
],
```

**Custom text, e.g. 'Tax ID Reference'**

```javascript title="Core Script"
checkoutCustomElements: [
  {
      translations: {
          en: {
              title: "Tax ID Reference",
              detail: "Please enter your Tax ID reference"
          }
      },
      name: "tax-id",
      attributes: {
          required: false,
          type: "text",
          placeholder: "Enter Tax ID reference",
          minlength: 4,
          maxlength: 600
      }
  },
],
```

**Drop-down menu ("select" menu), e.g. 'Seasonal information'**

Options can be grouped under headings (`groupName`), as in this example with "Group A" and "Group B".

```javascript title="Core Script"
checkoutCustomElements: [
 {
    translations: {
      en: {
        title: "Option Title",
        detail: "Select Option Detail"
      }
    },
    name: "select-option-test",
    attributes: {
      required: true,
      type: "select",
    },
    options: [
      {
        translations: {
          en: {groupName: "Group A"},
        },
        items: [
          {value: "Option 1", 
            translations: {
              en: {
                label: "Option 1"
              }
          }
          },
          {value: "Option 2", 
            translations: {
              en: { label: "Option 2" }
            }
          }
        ],
      },
      {
          translations: {
          en: { groupName: "Group B" }
        },
        items: [
          {value: "Option 3", 
            translations: {
              en: { label: "Option 3" }
            }
          },
          {value: "Option 4", 
            translations: {
              en: { label: "Option 4" }
            }
          }
        ],
      }
    ]
  }
],
```

**Custom text, e.g. 'Shipping instructions'**

```javascript title="Core Script"
checkoutCustomElements: [
  {
      translations: {
          en: {
              title: "Shipping instructions field",
              detail: "Please confirm any shipping instructions for us"
          }
      },
      name: "shipping-instructions",
      attributes: {
          required: true,
          type: "text",
          placeholder: "Shipping instructions field",
          minlength: 4,
          maxlength: 600
      }
  },
],
```

**Number, e.g. 'Contact phone number'**

```javascript title="Core Script"
checkoutCustomElements: [
  {
      translations: {
          en: {
              title: "Contact phone number",
              detail:  "Please supply a phone number to allow us to contact you"
          }
      },
      name: "number-field",
      attributes: {
          type: "number",
          min: 10,
          max: 25,
      }
  },
],
```

**File attachments (e.g. Purchase Order file upload)**

File uploads are also added as a custom checkout field. See [Let customers upload files at checkout](#file-upload-file-attachments).

**Date picker that requires date at least 1 day in future**

```javascript title="Core Script"
checkoutCustomElements: [
  {
    name: "delivery-date",
    translations: {
      en: {
        title: "Delivery Date",
        detail:  "Delivery date must be at least one day in future."
      }
    },
    attributes: {
      required: true,
      type: "date",
      min: ((d) => { 
        d.setDate(d.getDate() + 1); 
        return d.toISOString().slice(0,10); 
      })(new Date())
    }
  },
],
```

**Date picker that restricts by weekends and specific dates**

This uses `onChange` to block past dates (and today after 12:00 UK time), weekends and the listed UK bank holidays, with a different message for each. Update the bank holiday list for the current year.

```javascript title="Core Script"
checkoutCustomElements: [
  {
  translations: {
    en: {
      title: "Delivery Date",
      detail: "Delivery unavailable on weekends.",
      'select-mon-fri': "Date must be Monday-Friday",
      'select-date-in-future': "Select a date in the future",
      'select-non-bank-holiday': "Select another date which is not a UK bank holiday",
    },
  },
  name: "delivery-date-requested",
  attributes: {
    required: true,
    type: "date"
  },
  onChange(val, el) {
    const [year, month, date] = val.split('-');
    const selectedDate = new Date(
      Number(year),
      Number(month)-1,
      Number(date), 
      0,
      0,
      0,
      0
    );
    const now = new Date()
    const ukTime = now.toLocaleString(
      'en-GB',
      {
        hour: '2-digit',
        hour12: false,
        timeZone: 'Europe/London'
      }
    );

    const earliestDeliveryDate = new Date(
      now.getFullYear(),
      now.getMonth(),
      now.getDate() + (Number(ukTime) >= 12 ? 1 : 0)
    )

    const ukBankHolidays = [
      '07/04/2023',
      '10/04/2023',
      '01/05/2023',
      '08/05/2023',
      '29/05/2023',
      '28/08/2023',
      '25/12/2023',
      '26/12/2023',
    ];

    const selectedDateStr = new Intl.DateTimeFormat('en-GB', { dateStyle: 'short' })
      .format(selectedDate);

    let messageTranslationKey
    switch (true) {
      // Date is in the past
      case selectedDate < earliestDeliveryDate:
        messageTranslationKey = 'select-date-in-future'
        break;
      // Day is weekend
      case [0, 6].includes(selectedDate.getDay()):
        messageTranslationKey = 'select-mon-fri'
        break;
      // Is bank holiday
      case ukBankHolidays.includes(selectedDateStr):
        messageTranslationKey = 'select-non-bank-holiday'
        break;
    }

    return {
      valid: messageTranslationKey === undefined,
      messageTranslationKey
    }
  }
}
],
```

**Checkbox to require customer confirmation**

```javascript title="Core Script"
checkoutCustomElements: [
  {
    translations: {
      en: {
        title: "I agree to the terms and conditions",
        detail: "Please confirm you've read and agree to the terms and conditions",
      },
    },
    name: "confirmation",
    attributes: {
      required: true,
      type: "checkbox"
    },
  },
],
```

## Reference

### Custom field settings

Settings for fields added in the Core Script, for your developer:

| Key | What it does |
| --- | --- |
| `name` | The name of the field. It's shown in your eCommerce platform but not to customers. **Required** (standard fields use `id` instead). |
| `translations` | An object of customer-facing text, keyed by two-letter language code ([ISO 639-1](https://www.wikiwand.com/en/ISO_639-1)). **Required.** |
| `title` | Inside `translations`: the text shown in bold above the field. **Required.** |
| `detail` | Inside `translations`: small helper text shown under the field, for example to explain what to enter. |
| `attributes` | HTML attributes for the field, which set its type and validation: `max`, `maxlength`, `min`, `minlength`, `name`, `pattern`, `placeholder`, `required` (default `false`), `disabled` (default `false`), `step` and `type` (default `text`). Some attributes only apply to certain types; see the [MDN input attributes reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attributes). |
| `options` | For `select` fields: the drop-down options, optionally in named groups. |
| `onChange` | A function that validates the value and returns a message key from `translations` if it's invalid. |

To change the default look of the fields, see [Frontend integration](https://docs.sparklayer.io/developers/frontend.md).

### Supported field types

| Field type | What the customer enters |
| --- | --- |
| `text` | Free text |
| `select` | A choice from a drop-down menu |
| `number` | A number |
| `date` | A date, DD/MM/YYYY |
| `time` | A time, 00:00 |
| `week` | A week (for example, week 4) |
| `month` | A month of the year (for example, 12) |
| `datetime-local` | A date and time, DD/MM/YYYY 00:00 |
| `checkbox` | A tick box (allows multiple selections) |
| `tel` | A phone number |
| `email` | An email address |
| `url` | A website URL |
| `file` | A file attachment (Growth, Pro and Enterprise plans) |

## FAQs

**Do I need a developer to add checkout fields?**

Not for standard or custom fields: add them at **Storefront > Options > Checkout** in the SparkLayer Dashboard ([open](https://app.sparklayer.io/storefront/options)), or **SparkLayer Wholesale > Storefront > Options > Checkout** in the Shopify app. File uploads and validation rules need a developer. See [What you can do without code](#what-you-can-do-without-code).

**Can I use custom checkout fields on Wix?**

**Wix only:**

Yes, with a developer. They add the fields in code, with `checkoutCustomElements` in the `window.sparkWixOptions` script. See [JavaScript options](https://docs.sparklayer.io/help/platforms/wix/install.md#javascript-options) and [Wix limitations](https://docs.sparklayer.io/help/platforms/wix/limitations.md).

**What's the difference between checkout fields and the Additional Information field?**

**Additional Information** is one free-text box (up to 512 characters), saved to the order notes. You can add as many checkout fields as you need, each with its own type and validation. See [Cart and checkout](https://docs.sparklayer.io/help/ordering/cart-and-checkout.md#set-up-the-additional-information-field-po-number).

**Can I raise the 20MB file size limit?**

No. 20MB is the maximum. You can set a lower limit with `maxsize`.

**Why can't I open an uploaded file from the Shopify order?**

**Shopify only:**

Shopify stores only a reference to the file. Download it from the customer's account (as the customer or a sales agent) or through the Files API. See [Download uploaded files](#download-uploaded-files).