How to Add a Gift Message Field to Shopify Cart Page

2026-10-09 · upselling

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:

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:

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:

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:

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.