How to make Line Item Property appear on cart page

Shopify Discussion

Topic summary

The discussion addresses how to display custom line item properties (like personalized text fields) on Shopify cart pages after customers enter information on product pages.

Initial Problem:

  • User added a custom text input field using liquid code on the product page, but the entered data wasn’t appearing on the cart page or in orders.

Solutions Provided:

For Classic Themes:

  • Modify cart-template.liquid by adding a loop to iterate through item.properties and display each property using property.first (key) and property.last (value).
  • Critical fix: Ensure form inputs include form="{{ product_form_id }}" attribute to properly link the input to the product form.

For Shopify 2.0/Studio Themes:

  • Traditional liquid methods don’t work due to JSON-based theme structure.
  • Multiple users recommend a specific tutorial (ed.codes blog post) that provides step-by-step instructions for adding custom fields in 2.0 themes.

Current Status:

  • The thread remains open with a recent request for help implementing this on the Horizon theme, indicating ongoing challenges with newer theme architectures.
Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.
1

Hi! I am using the custom liquid section to add a box where people can add in a “Custom Location” that will be printed on their product. Code for the custom liquid…

Custom Location:

via: https://ui-elements-generator.myshopify.com/pages/line-item-property

The box appears and looks correct but does not translate to the cart page/order form, could someone please help me with this!? I am not a coder so might need step by step help here!

Webpage: https://french-graffiti.myshopify.com/?key=bacc869f94c85356b65bd5a3d68a651fe1d8dc6e53106a276c21c79677c299e7&preview_theme_id=

2

To make the line item property appear on the cart page in your Shopify store, you’ll need to modify your theme’s liquid code. Here are the steps you can follow:

  1. Open your Shopify admin and go to Online Store > Themes.
  2. Find the theme you’re currently using and click on the “Actions” dropdown, then select “Edit Code”.
  3. In the left-hand sidebar, navigate to the “Sections” folder and click on the “cart-template.liquid” file.
  4. Find the following code in the “cart-template.liquid” file:

{% for item in cart.items %} {% include 'cart-item' with item %} {% endfor %}

 
  1. Replace it with the following code:

{% for item in cart.items %} {% include 'cart-item' with item %} {% for property in item.properties %} <p>{{ property.first }}: {{ property.last }}</p> {% endfor %} {% endfor %}

 
  1. Save the changes to the “cart-template.liquid” file.

With this code, you should be able to see the custom location property that customers added to their cart item. You can modify the appearance of the property as needed by editing the HTML and CSS of the code. If you’re not comfortable making these changes yourself, you may want to consider hiring a Shopify expert to assist you.

1 Like
3

Hi,

I tried to follow the steps with no success.

==========================

In product.liquid I added in the form:

{%- form ‘product’, product, id: product_form_installment_id, class: ‘installment caption-large’ -%}

Your name

…

{{ form | payment_terms }}
{%- endform -%}

==========================

In main-cart-items.liquid

I added the following

aaaa
{% for property in item.properties %}

{{ property.first }}: {{ property.last }}

{% endfor %}
bbbb

==========================

When I view the cart I can see my selected product and then my labels aaaa and bbbb

Please help, how do I see the item properties?

4

Just found a solution, hope it helps others

My line items were missing: form=“{{ product_form_id }}”

Example:

Select your lasagna:

1 Like
5

I was trying to do this, but because I updated my template to Studio 2.0, this doesn’t seem to work. The organization has changed, and they seem to be moving away from liquid to json, whatever that means. Any ideas what’s going on?

6

If you still need help, this guy helped me in a couple of steps. Super easy! https://ed.codes/blog/add-a-text-field-to-products-in-shopify-2-0-gift-notes-engravings-customizable-products-etc

7

If anyone needs help, I got my problem solved! I have Studio 2.0, so it uses .json and new ways of adding custom things to your pages. This guy rocked, and gave me the tools to do what I needed very simply. Please check out his link and give him a donation if you can, to show your love. https://ed.codes/blog/add-a-text-field-to-products-in-shopify-2-0-gift-notes-engravings-customizable-products-etc

8

This is super useful and should be marked as the answer.
You can create a for with cart.items, then you iterate that for with some identifier like item within the items array.
Then you create a for with item.properties, and you can iterate with some identifier like property within the properties array.
Then you can call each property through property.first as the key and property.last as the value for that key.

{% comment %}
Example using the cart items cart properties and even the title of a certain given product present at the cart.
Remember:
The key would be property.first.
The value would be property.last.
{% endcomment %}
{% for item in cart.items %}
  {% for property in item.properties %}
    {% capture property_value_to_compare %}
      {{ property.last | downcase }}
    {% endcapture %}
    {% if property_value_to_compare contains "something_in_downcase" %}
    {% endif %}
  {% endfor %}
  {% capture product_title_to_compare %}
    {{ item.product.title | downcase }}
  {% endcapture %}
  {% if product_title_to_compare contains "something_in_downcase"  %}
  {% endif %}
{% endfor %}
9

Could someone please help me achieve this with the new Horizon theme? I have the code in a custom liquid block on my product page, but now need the text entry to show in the cart.