How to Add a Gift Message Field to Shopify Cart Page
Gift orders are a meaningful slice of revenue for most small Shopify stores, and the cart page is where the intent is still fresh. If a customer has to email you after checkout to say "please write Happy Birthday, love Mum," you've added manual work to your day and risk to their order. Adding a gift message field directly to the cart captures that note before payment, attaches it to the order, and shows it on the packing slip. Here's how to do it — free with theme code, or fast with an app.
Why Add a Gift Message Field to Your Shopify Cart Page?
A gift message field does three practical things:
- Captures intent at the right moment. Buyers decide to send a gift while they're looking at the cart, not after they've paid. Asking there gets a higher completion rate than a post-purchase email.
- Reduces support tickets. No more "can you add a note?" emails that you have to reconcile against an order number manually.
- Enables gift-specific upsells. Once you know it's a gift, you can prompt for gift wrap, a handwritten card, or a "hide prices on the packing slip" option — all of which are legitimate add-on revenue.
It also protects you operationally. A note typed into a field that's saved as an order attribute is searchable and printable. A note sent by email is not.
Option 1: Add a Gift Message Field with Theme Code (Free)
This works on any Shopify theme that uses a standard cart template, including Dawn, Refresh, Craft, and most paid themes from the Shopify Theme Store. You'll edit three files, so duplicate your theme first (Online Store → Themes → … → Duplicate) and work on the copy. If you break the live theme, you'll be restoring from a backup rather than explaining a blank cart page to customers.
The approach uses Shopify's cart attributes — custom fields stored on the cart and carried through to the order. No app, no monthly fee, no third-party script.
Step 1: Edit Your Cart Template
In your Shopify admin, go to Online Store → Themes → Edit code. Open the sections folder and find main-cart-items.liquid (in older themes it may be cart-template.liquid or sections/cart-template.liquid).
You need to place the gift message field inside the existing <form> that submits to /cart. Look for a line like:
<form action="{{ routes.cart_url }}" method="post" novalidate class="cart">
The field must be inside this form, otherwise the value won't be submitted with the cart. A good spot is just below the cart line items loop, or immediately above the checkout buttons. If your theme splits the cart into a line-items section and a footer section containing the checkout button, put the field in the line-items form — that's the one that posts to /cart.
Step 2: Add the Gift Message Field Code
Paste this markup where you want the field to appear:
<div class="cart-gift-message">
<label for="gift-message">Add a gift message (optional)</label>
<textarea
id="gift-message"
name="attributes[Gift message]"
maxlength="200"
rows="3"
placeholder="e.g. Happy Birthday Sam — love from everyone at the office"
>{{ cart.attributes['Gift message'] }}</textarea>
<p class="cart-gift-message__hint">We'll include this on the packing slip. Max 200 characters.</p>
</div>
Three details matter here:
name="attributes[Gift message]"is what makes this a cart attribute. The text inside the brackets becomes the label shown on the order in your admin. Keep it short and consistent.- The
{{ cart.attributes['Gift message'] }}value re-populates the field if the customer returns to the cart, so their note isn't wiped when they update quantities. maxlength="200"keeps messages to a length that fits on a card or packing slip.
Add a little CSS in your theme's stylesheet so it doesn't look bolted on:
.cart-gift-message { margin: 1.5rem 0; }
.cart-gift-message label { display: block; font-weight: 600; margin-bottom: 0.5rem; }
.cart-gift-message textarea { width: 100%; padding: 0.75rem; border: 1px solid #ccc; border-radius: 4px; }
.cart-gift-message__hint { font-size: 0.85rem; color: #666; margin-top: 0.25rem; }
Step 3: Save the Gift Message to the Order
Here's the part most tutorials skip: cart attributes do not automatically appear on the order confirmation email or packing slip. They're stored on the order, visible in the admin under the order's Additional details section, but you have to add them to your notification templates if you want them printed.
Go to Settings → Notifications → Order confirmation (and repeat for New order and Packing slip if you use them). Find a sensible spot and add:
{% if attributes['Gift message'] %}
<p><strong>Gift message:</strong> {{ attributes['Gift message'] }}</p>
{% endif %}
Save each template. Now the message appears in the customer's confirmation email and, critically, on the packing slip your fulfilment team or 3PL prints. Without this step, someone has to open every order in the admin to check for notes — which defeats the purpose.
Option 2: Use a Low-Cost Shopify App
If you're not comfortable editing Liquid, or you want the field to appear on the product page and in a slide-out cart as well, an app is the pragmatic choice. These add a field, save it to the order, and handle the notification templates for you.
Apps worth evaluating for this job:
- Cart Attributes — built specifically for adding custom fields to cart and checkout, including gift messages.
- Gift Note / Gift Message apps — several apps in the Shopify App Store do exactly this, often with gift wrap upsells bundled in.
- Releasit or similar cart customisation apps — broader cart editing tools that include attribute fields.
When comparing them, check these criteria rather than star ratings:
| Criteria | What to look for |
|---|---|
| Field placement | Cart page only, or also product page and mini-cart? |
| Order data | Does it write to order attributes (searchable) or just a note? |
| Notifications | Does it auto-insert the message into confirmation emails and packing slips? |
| Theme compatibility | Confirmed support for your theme, especially Online Store 2.0 themes |
| Pricing model | Flat monthly vs. usage-based — check current pricing on the listing |
| Checkout impact | Confirm it doesn't require Plus-only checkout extensibility |
If an app requires Shopify Plus to work, it won't run on a standard plan. Verify that before installing.
Testing, Styling, and Order Fulfillment Tips
Test the free method before you announce it anywhere. Add a product to the cart, type a message, hit update, and confirm the text survives the page reload. Then complete a test order (use Shopify's Bogus Gateway or a 100% off discount code) and check that the message appears under Additional details on the order, in the confirmation email, and on the packing slip.
A few things that save time later:
- Make the field optional and unmissable. A bold label plus a hint line outperforms a bare textarea.
- Don't put the field on the checkout page. Shopify's checkout is locked down unless you're on Plus; the cart is the correct place.
- Set a character limit and stick to it. 200 characters fits a standard gift card. Anything longer needs a different process.
- Consider a "hide prices" checkbox. If you're shipping directly to a recipient, a second attribute like
attributes[Hide prices]prevents the awkward moment where the gift arrives with an invoice. - Check mobile. The cart page is where most mobile buyers abandon. A textarea that's awkward to tap costs you orders.
- Tell your fulfilment team. If you use a 3PL, confirm they read order attributes, not just line items. If they don't, route gift orders to a manual queue.
Done properly, this is a twenty-minute change that removes a recurring admin task and makes your store feel like it was built by someone who thought about the customer. Start with the free theme-code route, test it with a real order, and only reach for an app if you need the field in multiple places.
FAQ
Will the gift message show up on the customer's order confirmation email automatically? No. Cart attributes are saved to the order but aren't included in notification templates by default. You need to add the Liquid snippet above to your Order confirmation, New order, and Packing slip templates in Settings → Notifications.
Does this work on Shopify's new checkout? Yes, because the field lives on the cart page, not the checkout. Cart attributes pass through to the order regardless of which checkout version you're on. Editing the checkout itself still requires Shopify Plus.
Can I add the gift message field to the product page instead?
Yes, but it's more work. You'd need a line item property (properties[Gift message] inside the product form) rather than a cart attribute. Line item properties attach to a specific item, which is better if only some products in an order are gifts — but they don't aggregate into a single order-level note.