Product custom options
Custom options are blocks that add fields to the product form: Single line text, Multi line text, Date, Checkbox, Pills, Dropdown and File upload. What the buyer enters is saved on the order as a line item property, so you see it in Shopify Admin with the order.
Before you start
Custom options aren't variants: they don't change the price or inventory. To charge more for an option, create a separate product or variant.
How to set it up
Step 1: Add an option block
- Open a product in the theme editor and click Add block in the Product section.
- Choose a Custom options block, for example Custom options: Pills.
- Drag it above the Buy buttons block.
Step 2: Set it up
- Enter an Option name (1). It must be unique: it is the name saved with the order, for example
Engraving. - Enter the Option label shoppers see, and for Pills and Dropdown, the Options separated by commas, for example
Gift wrap, No gift wrap. - Add an Info tooltip if the option needs explaining, and set the layout and text styles.
Settings reference
Custom options: Pills
| Option name | Must be unique. If left empty, the option can't be saved with the order, and the block won't be displayed. |
|---|---|
| Option label | |
| Options | Separate by commas, for example: Option 1, Option 2 |
| Info tooltip | |
| Layout | Options: Two columns, In a row. |
| Label style | Options: Body, Caption, Subheading. |
| Uppercase | Turns this on or off. |
| Make font bolder | Turns this on or off. |
| Text style | Options: Body, Caption, Subheading. |
| Uppercase | Turns this on or off. |
| Make font bolder | Turns this on or off. |
| Desktop | |
| Alignment desktop | |
| Mobile | |
| Alignment mobile | |
| Spacing | |
| Top spacing (desktop) | Slider. |
| Bottom spacing (desktop) | Slider. |
| Top spacing (mobile) | Slider. |
| Bottom spacing (mobile) | Slider. |
How it works
- The same blocks are available in Featured product and Quick view.
- A block with an empty Option name isn't shown, since it couldn't be saved with the order.
- File upload sends the file with the cart, so the buyer must use Add to cart (or the theme's Buy it now). Accelerated checkout buttons such as Shop Pay can't carry a file, so with a file selected the theme adds the item to the cart first and then goes to checkout.