# Custom option

{% hint style="warning" %}
Custom options uses [line item properties](https://shopify.dev/themes/architecture/templates/product#line-item-properties) to collect and display additional information in the cart and order details. **Custom options does not support add-on pricing**.
{% endhint %}

In the Product template, you can add **Custom options** to let customers personalize products or customize their order before updating their cart. 

Your customer's entered text and selected options will appear in the cart and order details.

![](https://475958657-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyt3Wwaqhge0XvrXmVj7D%2Fuploads%2Fgit-blob-0c6f2877eb7eb6f00d4fded4a42ac3610bd546b4%2Fproduct-custom-options.png?alt=media)

## Watch tutorial

{% embed url="<https://youtu.be/t-v4O9wvAKI>" %}

## Add custom option block

***

* Under **Product overview**, click **(+) Add block** and select **Custom option**.&#x20;
* Use the drag-and-drop handles **`⋮⋮`** to re-order blocks.  Click the block to start adding content.

&#x20;

## Set up custom option

***

* Choose the **type** of option
* Change the **label** of the option
* Add special **instructions** to tell customers about the option and any requirements (e.g., a maximum of 10 words).

&#x20;

`Click Custom option block to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Field type</mark></td><td>Select the type of option.</td><td><strong>Text</strong> <em><mark style="background-color:yellow;">Default</mark></em><br><strong>Long text</strong><br><strong>Checkbox</strong><br><strong>List</strong></td></tr><tr><td><mark style="color:blue;">Field label</mark></td><td><p>Enter text that names the option.</p><p><br>If you're using multiple custom options in a product form, then make sure the field labels are unique. Learn more about <a href="https://shopify.dev/themes/architecture/templates/product#line-item-properties">line item properties</a>.</p></td><td><em><mark style="background-color:yellow;">Default: "Your label"</mark></em></td></tr><tr><td><mark style="color:blue;">Instructions</mark></td><td>Add instructions to describe how the custom option is applied to the product.</td><td><em><mark style="background-color:yellow;">Default: "Special instructions"</mark></em></td></tr></tbody></table>

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-type="content-ref"></th></tr></thead><tbody><tr><td><mark style="color:blue;"><strong>Text</strong></mark></td><td>A text field for customers to add a single word or line.</td><td><a href="#text-field">#text-field</a></td></tr><tr><td><mark style="color:blue;"><strong>Long text</strong></mark></td><td>A text field for customers to add multiple lines.</td><td><a href="#text-field">#text-field</a></td></tr><tr><td><mark style="color:blue;"><strong>Checkbox</strong></mark></td><td>A single 'yes' or 'no' option.</td><td><a href="#checkbox">#checkbox</a></td></tr><tr><td><mark style="color:blue;"><strong>List — Dropdown</strong></mark></td><td>A menu of options that requires a single choice.</td><td><a href="#options-list">#options-list</a></td></tr><tr><td><mark style="color:blue;"><strong>List — Radio buttons</strong></mark></td><td>A list of buttons for options that requires a single choice.</td><td><a href="#options-list">#options-list</a></td></tr></tbody></table>

&#x20;

### Text field

***

Show a text field for customers to add a message or other details to their order. Select the field type:

* **Text** for single-line text
* **Long text** for multiple lines of text

`Click Custom option block to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Field placeholder</mark></td><td>Change the text that appears until the customer enters their own text.</td><td><em><mark style="background-color:yellow;">Default: "Enter your text here"</mark></em></td></tr></tbody></table>

&#x20;

### Checkbox

***

Set the field type to **Checkbox** to give customers a 'yes' or 'no' option.  The checkbox uses the **Field label** as the option text.

{% hint style="info" %}
You can add multiple Custom option blocks with checkboxes to let customers select one or more options from a set of options.
{% endhint %}

### Options list

***

Set the field type to **List** to display multiple options as a **Dropdown** or **Radio buttons**.

&#x20;

`Click Custom option block to find settings`

<table><thead><tr><th width="157">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">List style</mark></td><td>Display options as a dropdown menu or a list of radio buttons.</td><td><strong>Dropdown</strong> <em><mark style="background-color:yellow;">Default</mark></em><br><strong>Radio buttons</strong></td></tr><tr><td><mark style="color:blue;">List options</mark></td><td><p>Enter multiple options as a comma-separated list.</p><p>For example: "Option 1, Option 2, Option 3"</p></td><td></td></tr></tbody></table>

<br>

***

> **Related links**
>
> [Product template](https://help.fluorescent.co/cornerstone/product-pages/product-template)\
> [Variant options](https://help.fluorescent.co/cornerstone/product-pages/variant-options)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.fluorescent.co/cornerstone/product-pages/product-page-blocks/custom-option.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.