> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.optis.me/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Text box

1. [OPTIS Product Options, Variant](/product-options)
2. [20 Option Types](/product-options/20-option-types)
3. [Text Input](/product-options/20-option-types/text-input)

# Text box

A **Text box** is a single-line field for short text - unlike a [Text area](/product-options/20-option-types/text-input/text-area), it holds one line only, so it's best for short answers.

![](https://storage.crisp.chat/users/helpdesk/website/-/6/c/9/c/6c9c89cbb9046800/d5444597-c434-4538-9645-ccf012_towqyn.png)

## When to use a Text box

* **Personalization** - a name or short message to engrave or print.
* **Forms** - a shipping address, a note, or another short detail.
* **Order notes** - a comment or special request for the order.

## How to add a Text box option
### Step 1: Add the option

Open **1. Add options**, click **Add option**, tick **Text box** under **Text input** on the **New options** tab, then click **Add options**.

![](https://storage.crisp.chat/users/helpdesk/website/-/f/2/5/7/f257064883dab000/d8203f5d-bf8c-4c72-bd8e-d5cab6_1ech9sj.png)

![](https://storage.crisp.chat/users/helpdesk/website/-/a/0/d/b/a0dbdf0a8beb0800/82605b80-9194-4f21-8329-361a31_zeq8tr.png)

### Step 2: Name it

Enter the **Label on product** (e.g., "Input your name", "Note"). Use **Label on cart** if the cart and order should show a different name. Tick any options below based on your needs:

* **Required field** if customers must fill it in
* **Hide option label** to hide the label

![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/e/6/13e60bb80801c200/e84a1214-7ed4-4b1a-922a-ecdc07_1kxrl52.png)

### Step 3: Save and test

Click **Save**, then open the product page on your store to check that the Text box works correctly.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/6/3/2/b6328528a627b000/5b3047af-370c-4480-ab0d-f64c84_ytawcj.png)

## Option settings

Set only what you need - all of the settings below are optional.

![](https://storage.crisp.chat/users/helpdesk/website/-/9/1/3/1/9131838ee9778000/c463e1eb-a50a-4dc8-be71-466450_4lppbr.png)

* **SKU** - a SKU for this field. Advanced plan and above. See [How does Product Option SKU works?](/product-options/customize-design/how-does-product-option-sku-works).

### Default value and placeholder

* **Placeholder text** - a faded hint shown inside the field (e.g., "Type your message here"). It disappears once the customer starts typing. Available on every plan.

![](https://storage.crisp.chat/users/helpdesk/website/-/f/0/e/e/f0eef88a531a6800/70982e57-6e7b-4fd2-acb7-cfb4c9_1457cuo.png)

How the placeholder looks on your storefront:

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252F7junpvfI8eabjUFvSkkC%252FScreenshot%2520-%25202026-01-12T143933.865.png%3Falt%3Dmedia%26token%3D68782870-2072-4ea0-9be9-21dc4ccae2ff&width=768&dpr=3&quality=100&sign=9dcd21c5c89ca6bf841886118c9c9f02&sv=3)

* **Default value** - text that is already filled in when the customer opens the product page. Available on the **Advanced** plan and above.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FCECTDOawPxq0sC0C4LP6%252Fimage.png%3Falt%3Dmedia%26token%3Df24b9780-7b12-4609-864a-942706bac90c&width=768&dpr=3&quality=100&sign=cd98ccf2a49303689c69a979522b7b80&sv=3)

Example: pre-fill the "Message" field with "Happy Birthday!" so it appears automatically when customers open the product page.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252F92WrhS87ArNcJNcG07iq%252FScreenshot%2520-%25202026-01-12T142138.473.png%3Falt%3Dmedia%26token%3Db04ca98f-3d6e-4216-89c1-9179c58dc242&width=768&dpr=3&quality=100&sign=5c5594896f7fbf793c6aa8c6f2bc4392&sv=3)

### Help text

Add a short note explaining what to enter. Choose how it's shown: **Tooltip**, **Below the option title**, **Beside the option title**, or **Below the option**.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FuZoETiaRK2wqRlA2I367%252Fimage.png%3Falt%3Dmedia%26token%3D5e6c5bf1-a9cd-4ef1-8835-e42b4ce3eb74&width=768&dpr=3&quality=100&sign=bb530103f627fa50536df48b213aa4aa&sv=3)

### Limit the number of characters

Set **Min character** and **Max character** to control how much customers can type. Available on the **Advanced** plan and above.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FQasiki9gWmsLt4E9AY1f%252FScreenshot%2520-%25202026-01-12T144027.912.png%3Falt%3Dmedia%26token%3Db095b54f-2b70-4e91-84e9-650d4fcf07c6&width=768&dpr=3&quality=100&sign=c48b42b3373ba1344a15696deb4dc634&sv=3)

* **Min character** - if the customer's text is shorter than this, OPTIS shows a message under the field, e.g. **Min character: 10**.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252Fv26xkV4yR45PP29gh05C%252FScreenshot%2520-%25202026-01-12T144123.577.png%3Falt%3Dmedia%26token%3Ddf8ae210-6121-4e1f-a8a5-2de76cd62cc1&width=768&dpr=3&quality=100&sign=c26e6a08c24f06ef7eb29955b41d2517&sv=3)

* **Max character** - once the customer reaches this limit, OPTIS stops accepting more input and shows a message under the field, e.g. **Max character: 50**.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252Fri4uXj9FK1ICwvviXlOX%252Fimage.png%3Falt%3Dmedia%26token%3D3b26b870-c84b-4799-a4ae-004a4900bfbb&width=768&dpr=3&quality=100&sign=27e9d46324d28b712ca4f11a3764aca8&sv=3)

* **Character counter (optional)** - turn on **Character count for text box** in **Settings > General Settings > Option type setting > Text input** to also show a running count (e.g. **12/50 characters**) under the field. See [Limit Characters for Text Input](/product-options/faq/limit-characters-for-text-input).

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252F5D2U7lLWE40J4D5uqPSa%252Fimage.png%3Falt%3Dmedia%26token%3D01937bda-7391-4583-a032-49e902e5b02d&width=768&dpr=3&quality=100&sign=92f7946e78bad0dad24dd6fdb663b012&sv=3)

### Charge an extra fee (price add-on)

Charge more when a customer fills in this field. Available on the **Advanced** plan and above; **Upsell product** needs **Platinum**.

* **Extra fee** - adds a fixed amount to the price. See [Manage add-on (additional fee for option)](/product-options/advanced-setup/manage-add-on-additional-fee-for-option).

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FdD3AXyj1RXRbLRfA2rHv%252Fimage.png%3Falt%3Dmedia%26token%3Db4d523fb-5558-49be-8aac-eb57d4fd2721&width=768&dpr=3&quality=100&sign=c64065e086f78ef643f5f20daaf59083&sv=3)

How the price add-on looks on the storefront:

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FLaCXYprKy0prT4HINspP%252Fimage.png%3Falt%3Dmedia%26token%3Dede154b1-a92b-4faf-80e4-10adea6e2fc7&width=768&dpr=3&quality=100&sign=db45047498c62ac2fbdad3a7e064e8d3&sv=3)

* **Upsell product** - links the fee to a Shopify variant's price and stock. See [How to Use "Upsell product"?](/product-options/advanced-setup/how-to-use-upsell-product-link-stock-and-price-of-shopify-variant-to-option-value).

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FNQEnillZKrOA5zEnGWuy%252FScreenshot%2520%282%29.png%3Falt%3Dmedia%26token%3Da5eda0b1-43d4-406d-b23e-a9a574b7c147&width=768&dpr=3&quality=100&sign=6ceb8542e517dad1b538717d2858f319&sv=3)

### Show or hide with Visibility (conditional logic)

Show or hide the Text box based on another option - for example, only show it when the customer answers "Yes" to "Would you like to personalize this item?". Available on the **Advanced** plan and above. See [How to set up Conditional logics?](/product-options/advanced-setup/how-to-set-up-conditional-logics).

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FoMJ1lw7yoh25TvvlQpRn%252Fimage.png%3Falt%3Dmedia%26token%3D09e2d10d-ff45-4a8e-8466-d6dde5b6ed23&width=768&dpr=3&quality=100&sign=46d9712c5a4189b691c3846046ac1994&sv=3)

### Preview the text on the product (live mockup)

Show the text customers type directly on the product image, updated in real time. Available on the **Platinum** plan and above. See [Product Personalizer - Live Mockup Settings](/product-options/advanced-setup/product-personalizer-live-mockup-settings).

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252FwAH65NnA2nmEDzlvlEpd%252Fimage.png%3Falt%3Dmedia%26token%3D0418eb60-4546-4fb1-9e9d-0466f0bd293b&width=768&dpr=3&quality=100&sign=1bd120d9bfaa9c0fd9235f48722edd6c&sv=3)

### Option width

In the **Display** tab, set **Option width** (**25%**, **33%**, **50%**, **67%**, **75%** or **100%**) to control how much horizontal space the Text box takes.

![](https://docs.optis.me/~gitbook/image?url=https%3A%2F%2F1821185975-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FRFiuDpHWm2HwzxPH4lfM%252Fuploads%252F807HMv7Ip9q8gxznlXtX%252Fimage.png%3Falt%3Dmedia%26token%3D99b9da3f-05d9-4cd3-8d30-82c9218dc599&width=768&dpr=3&quality=100&sign=e8fc093c8cf85024e8761f6c733bb033&sv=3)

## Related guides

* [Text area](/product-options/20-option-types/text-input/text-area)
* [Manage add-on (additional fee for option)](/product-options/advanced-setup/manage-add-on-additional-fee-for-option)
* [How to Use "Upsell product"?](/product-options/advanced-setup/how-to-use-upsell-product-link-stock-and-price-of-shopify-variant-to-option-value)
* [How to set up Conditional logics?](/product-options/advanced-setup/how-to-set-up-conditional-logics)
* [Product Personalizer - Live Mockup Settings](/product-options/advanced-setup/product-personalizer-live-mockup-settings)