Two ways to capture personalisation
Shopify owns the storefront and checkout, so the input is added through Shopify-native mechanisms. Pick one path.
- Line-item property — a custom field on the product page. Works on every Shopify plan. Requires a small theme edit.
- Checkout UI extension — a custom block rendered inside checkout. Shopify Plus only. No theme edit, but a developer deploys a custom app.
Both methods produce the same outcome: a property attached to the line item. As long as it is named Customization Request, Alva auto-extracts the value.
Method 1 — Line item property
1. Open the product template
In Shopify admin, go to Online Store → Themes, click Edit code, and open sections/main-product.liquid (or product-template.liquid on older themes).
Shopify theme code editor. Show the file tree on the left with main-product.liquid highlighted, and the Liquid file open on the right scrolled to the product form block. No real shop data visible.
2. Add the input inside the product form
Inside the {% form 'product' %} block, add a label and a text input. The name attribute must use the bracket syntax properties[Customization Request] — this tells Shopify to attach the value to the line item.
<label for="customization">Personalisation request</label>
<input type="text"
id="customization"
name="properties[Customization Request]"
maxlength="200"
required>3. Set required and length constraints
Add required so customers cannot leave it blank, and maxlength="200" so they cannot paste a paragraph. Keep the label concrete — Name to embroider beats Customisation.
4. Save and place a test order
Save the template, view the product on the storefront, fill in the input, and place a test order. The value appears in Shopify under Order → Line items and inside Alva on the personalised order detail page.
A product page on the storefront with the personalisation input rendered above the Add to cart button. Field labelled "Name to embroider" with a placeholder example. No real shop branding required.
Method 2 — Checkout UI extension
Plus merchants can render the input inside checkout itself. Alva Digital Downloads does not ship this extension — building it is a Shopify developer task. See Shopify's checkout UI extensions reference for the current API.
1. Scaffold an extension
From a custom Shopify app, run shopify app generate extension and choose Checkout UI extension. Pick the purchase.checkout.block.render target.
2. Write the line-item property
Use the line-item property API from @shopify/ui-extensions-react/checkout to attach the value to the line item under the key Customization Request.
3. Deploy and place the block
Run shopify app deploy, then in Settings → Checkout → Customise, drop the new block into the layout and place a test order.
Where the value appears in Alva
When Shopify fires the orders/paid webhook, Alva reads any line-item property named exactly Customization Request and stores it against the purchase. The personalised order detail page renders the value above the file uploader, and the same text is included in the merchant notification email.
FAQ
Can I make the customisation field required?
Yes. Add the HTML required attribute. Shopify blocks Add to cart until the field has a value. The checkout UI extension method exposes a required option in the extension settings.
Can I capture more than one input per product?
Yes, but Alva only auto-extracts the property named Customization Request. Other line-item properties still appear on the Shopify order and are visible inside Alva on the order detail page.
Can the customer edit the input after the order is paid?
No. Line-item properties are immutable once the order is placed. If a correction is needed, ask the customer to email it and update the order notes manually before uploading the file.
See also
Was this helpful?
Last updated 2026-05-06