Solved

How to enlarge input area for product customization fields (dawn theme)

anon7
Shopify Partner
34 1 2

I am trying to enlarge the "Order Notes" text input area. 

(Dawn Theme)

Accepted Solution (1)
Moeed
Shopify Partner
3794 958 1190

This is an accepted solution.

Ah I see why. Remove the previous code and add this new code with the same steps mentioned above in the end of theme.liquid file

<style>
textarea {
    min-height: 125px !important;
    min-width: 500px !important;
}
</style>

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Replies 12 (12)

Moeed
Shopify Partner
3794 958 1190

Hey @anon7 

 

Share your Store URL and Password if enabled.

 

Best Regards,

Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
anon7
Shopify Partner
34 1 2
anon7
Shopify Partner
34 1 2

Screenshot (220).png

Moeed
Shopify Partner
3794 958 1190

Hey @anon7 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

<style>
textarea#Order\ Notes-0-2 {
    min-height: 125px !important;
    min-width: 500px !important;
}
</style>

RESULT:

Moeed_0-1713117636744.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
anon7
Shopify Partner
34 1 2

The box only shows up larger if I drag it- is there a way it can be big right away?

anon7
Shopify Partner
34 1 2

I want all the placeholder text to show

Moeed
Shopify Partner
3794 958 1190

If you add this code then it will be big by default and you won't have to drag it to show it completely.

 

Best Regards,

Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
anon7
Shopify Partner
34 1 2

 Oh I see now. Any idea why it only worked for some products?

Moeed
Shopify Partner
3794 958 1190

This is an accepted solution.

Ah I see why. Remove the previous code and add this new code with the same steps mentioned above in the end of theme.liquid file

<style>
textarea {
    min-height: 125px !important;
    min-width: 500px !important;
}
</style>

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
anon7
Shopify Partner
34 1 2

Thank you!

Moeed
Shopify Partner
3794 958 1190

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

EasifyApps
Shopify Partner
541 16 42

Hi @anon7,

Next time, you can easily incorporate your text by using the free Easify Product Options app with the Text Area option type. It only takes a few minutes to set up, and there's no need for coding 🤗.

  • Storefront:
EasifyApps_1-1713174337980.png

 

  • App settings:
EasifyApps_0-1713174248752.png
EASIFY - MAKING SHOPIFY SIMPLE & SWEET!
Easify Product Options: Create custom product options 10X faster & easier!
Easify Product Attachments: Effortlessly add downloadable PDF files (or any other format) to Shopify pages!
Try for Free | 24/7 Live Chat Support