Text Area
1. How Does the Text area Display?
Text areas display as multi-line input boxes, designed for longer user entries. They typically appear larger than the Textbox and are used for things like special instructions, custom messages, or detailed feedback.
Note:
Once you choose this option type, your customers can insert any text but emoji.
Text Area type allows your customers to Enter and write more than one paragraph.
Example of how it appears on a product page:
2. How to Create a Text area option
Step 1: Add a New Option
Click Add Option > Text area to create a new option
Step 2: Add information to the Text area
Enter the name for the Text area (e.g., “Note")
Step 3: Set the target of Price add-on in Option values (optional)
Price Add-on feature will help you add extra fee for options customers choose.
How the Price add-on will look on the storefront:
If you choose to Create fee, see details of this feature in How to add price to options?.
If you choose to Upsell product, follow this guide for more information.
Other features:
Price Add-On > Create Fee – What is it & How to Use
Price Upsell product > Assign to Variant – What is it & How to Use
SKU – What is it & How to Use
Quantity – What is it & How to Use
Step 4: Advanced Settings (If Needed)
Conditional Logic: Enable conditional logic if you want the Text area to show/hide only when a customer selects a specific option from another field. How to set up Conditional logics?
Example: A “Message” Text area appears only if the customer selects “Yes” for “Would you want to leave a message?”
Help text: Add a short description to explain the purpose of the Text area option, offering context or clarification when the customer enters the information. Help text can be displayed as Tooltip or Content (Below/Beside the option title, Below the option).
Here is an example of the Help text as Tooltips looks like in your storefront:
Default value: Pre-fill text inside the Text area that appears every time the customer goes to the site. It can save time for customers by providing common or expected input.
Example: You want the option “Message” will display the text “Happy Birthday!” automatically in the field when customers go to the product page.
How it looks like in your storefront:
Placeholder text: Display placeholder text inside the Text area as a faded, lighter color. This text disappears when the customer starts typing and is often used to give customers a clear example of what should be filled in the field.
Here is an example of how it looks like in your storefront:
Limit characters: You can set Min/Max characters that customers can input in the Text area.
If your customers input less than the minimum value, it will show a notification message below. The same with maximum value.
Step 4: Save and Test
Click Save to apply the settings.
Visit the product page on your store to check if the Text area works correctly.
3. Real-World Applications of Text area
Custom Orders: Add engraving text, name personalization, or special color requests.
Gift Options: Write gift messages or delivery instructions.
Forms & Applications: Enter bios, cover letters, or detailed application responses.
4. Key Features of Text area
Text area provides a flexible space for users to enter longer, detailed input. Ideal for feedback, special requests, and custom messages, they improve communication and personalization.
Last updated