How to display custom fields in shopping cart

Store Design
1

Hello everyone,

I am trying to get custom fields to display in my shopping cart once a user has added the item with the custom fields to their cart.

Picture below shows the item with the custom fields :

Greggy55_0-1713294750618.png
Greggy55_0-1713294750618.png1562Ă—856 153 KB

I added this code to the main-product.liquid code block to achieve this. here is the code :

.main-product-property label { display: inline-block; width: 120px; /* Adjust as needed */ margin-right: 10px; /* Adjust as needed */ }

{% if product.metafields.custom.name_field %}

Name

{% endif %}

{% if product.metafields.custom.surname %}

Surname

{% endif %}

{% if product.metafields.custom.date_of_birth %}

Date of Birth

{% endif %}

{% if product.metafields.custom.time_of_birth %}

Time of Birth

{% endif %}

{% if product.metafields.custom.weight %}

Weight

{% endif %}

{% if product.metafields.custom.height %}

Height

{% endif %}

I also added custom data and added definitions for the different fields I wanted. The definitions are here :

  • Height
    product.metafields.custom.height

    True or false

    1 product

  • Weight
    product.metafields.custom.weight

    True or false

    1 product

  • Time of Birth
    product.metafields.custom.time_of_birth

    True or false

    1 product

  • Date of Birth
    product.metafields.custom.date_of_birth

    True or false

    1 product

  • Surname
    product.metafields.custom.surname

    True or false

    1 product

  • name field
    product.metafields.custom.name_field

    True or false

    1 product

I am now in my main-cart-items.liquid code editor , however I dont know how I can get these options to display in your cart.

Greggy55_1-1713294929952.png
Greggy55_1-1713294929952.png785Ă—411 41 KB

What do I need to add so it will now display the info on the product page ? I need this info to display in the shopping cart :

Name
Surname
Date of Birth
Time of Birth
Weight
Height

Thanks for any help!

Using Dawn theme.

Update

I went to my cart and i added the .json at the end of the url.

It seems like the custom fields are not being saved to the item? And that is why it is not displaying?

I had a chat with chatgpt , here is what it says :

From the JSON response, it appears that the “properties” object for the item is empty. This might be why the custom fields are not displaying in your cart. Make sure that the custom fields are correctly assigned to the product properties in your store’s backend. If the properties are correctly set but still not appearing, there might be an issue with how the properties are being rendered in your cart template.

I am not sure how to ensure the custom properties are being saved???

My store URL is :

https://40f42b-de.myshopify.com/

Password is : saompo

2

Hi @Greggy55

Sorry just need your confirmation. I see that the data already shown, have you solved the issue?

aldyexpatify_0-1713349045003.png
aldyexpatify_0-1713349045003.png1188Ă—616 63.7 KB

1 Like
3

Hi @Greggy55 ,

You can easily create your text fields using the free Easify Product Options app. It’s a quick solution that allows you to not only create the fields but also display the entered values on the cart page, all without any need for coding on your part. :blush:

1 Like
4

Yes I solved it thank you

5

I managed to solve it. thanks for the help!!!

6

@Greggy55 Cool :+1:
Would you mind marking the post as solved, please?

7

IF you don’t mind, how did you manage to solve this. Can you share how you did this. I have a similar issue with my website where I am trying to have the width, height and calculated price of the item show up in the cart but can’t seem to get it working.

1 Like