FROM CACHE - en_header

Cart - Use cart attributes to collect more information

Community Manager
Community Manager
417 40 1125

Cart attributes are custom form fields that let you collect additional information from your customers on the cart page. The information that you collect will display in a note on the customer's order in the admin. For example, if you want to ask customers how they heard about your store, then you can add an How did you hear about us? drop-down selection question to the cart.


Tip: Cart attributes are different from order notes and line item properties. Order notes, which are available in every free Shopify theme, let you capture special instructions on how to prepare and deliver an order. Line item properties are used to record customization information about specific products in an order. Line item properties are specified directly on the product page.

Sectioned themes and non-sectioned themes


The steps for this tutorial differ depending on whether you are using a sectioned or a non-sectioned theme. A sectioned theme is a newer theme that lets you drag and drop to arrange the layout of your store's pages.


To figure out whether your theme supports sections, go to the theme's Edit code page. If there are files in the Sections directory, you are using a sectioned theme. Non-sectioned themes were released before October 2016, and do not have files in the Sections directory.


If you are using a sectioned theme, then click the Sectioned themes button and follow the instructions. If you are using an older, non-sectioned theme, then click the Non-sectioned themes button and follow the instructions.



TyW | Online Community Manager @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Replies 50 (50)
New Member
1 0 0

Hi all,

I am having the same issue described in this thread on "not capturing and displaying cart information in the notification mails and order". This actually occurs rarely, like once every15-20 orders, but it is still painfully I have automated the capturing of order delivery date into order tag.

I will report here how I have included a datepicker to capture order delivery date. I hope it could be of help and maybe you could give me a hint on why sometimes the date is not captured in the orders.

In the Snippet folder, the delivery-date.liquid file contains:

  {{ '//' | stylesheet_tag }}
  <div style="width:300px; clear:both;">
      <label for="date">Choose delivery date:</label>
      <input required id="date" type="text" readonly='true' name="attributes[date]" value="{{ }}" />
      <span style="display:block" class="instructions"> We do not ship on Sundays and holidays.</span>
    window.onload = function() {
      if (window.jQuery) {
        let $ = window.jQuery;
        var unavailableDates = ["19/03/2021", "01/04/2021", "02/04/2021", "03/04/2021", "01/05/2021", "03/05/2021", "04/05/2021", "15/05/2021", "17/05/2021", "12/10/2021", "01/11/2021", "09/11/2021", "06/12/2021", "8/12/2021", "25/12/2021"];
        function noSundaysOrHolidays(date) {
          var day = date.getDay();
          var showDay = true;
          if (day != 0) {
            var string = jQuery.datepicker.formatDate('dd/mm/yy', date);
            showDay= (unavailableDates.indexOf(string) == -1);
            return [showDay];
          } else {
            return [day != 0, ''];
        $(function() {
            firstDay: 1,
            minDate: +2, 
            maxDate: '+60',
            dateFormat: 'DD d MM yy' ,
            beforeShowDay: noSundaysOrHolidays,
            beforeShow : function(){
var dateTime = new Date();
var hour = dateTime.getHours();
                var day = dateTime.getDay();
$(this).datepicker( "option", "minDate", "+3" );
                    if(day == 5 && hour>=18){
$(this).datepicker( "option", "minDate", "+4" );

So, the delivery date is captured in the variable attributes[date].  The delivery-date.liquid snippet goes into the cart-template.liquid --> {% render 'delivery-date' %}

The required declaration did not prevent customers from proceeding to checkout without having selected a date. In order to cope with this issue I have added to file theme.js (at the end of the file) the following code:

// This code makes mandatory the choice of delivery date
$(document).ready(function() {
$('body').on('click', '[name="checkout"], [name="goto_pp"], [name="goto_gc"]', function() {
      if ($('#date').val() == '' || $('#date').val() === undefined)
           alert("You must choose one of the available dates for delivery.");
           return false;
       } else {

In the Notification section (in Settings), I have added the following to Order Confirmation template:

<h4>Fecha de entrega:</h4>
{{ }}

So given the previous steps, in Order notes an "additional details" section appears where the date (and delivery time even though I have not included it in the code above).


However, as I said before, once every 15-20 orders this information does not appear and I do not have an explanation for this.

Anyone has a clue or could give some help?

Kind regards!


Shopify Expert
10959 196 2212

Ignoring the code for the moment, first run through the customer journey for purchasing.

Do you have accelerated gateways in place that might skip your custom data logic? 
Do you have the option to buy directly from the product page?

Those could be ways to quickly skip your custom logic.

★ I jump on these forums in my free time to help and share some insights. Not looking to be hired, and not looking for work. ★
New Member
1 0 0

Matt, did you find an answer to this? I too have put in the code, the drop down box is working but I can't see where I can find what customers are selecting? Thank you.

Shopify Partner
5 0 0

Change the input from attributes[yourname] to properties[yourname] and {{cart.attributes[yourname]}} to {{properties[yourname]}} this will show up in AJAX and Regular carts make sure it's added inside the product form and for ease of use above add to cart input.

If you are still not seeing it in AJAX cart make sure your ajax cart template has the following code 

                    {{#each this}}
                      {{#if this}}
                        <span class="someclass">{{@key}}: {{this}}&nbsp;<br></span>

 and that the theme.js file has some variation of this var someVariable =  


New Member
1 0 0

Hello! When a customer selects a shipping date it shows up as "Shipping-Date" on the shopify order. Is there a way to edit the text to say "Delivery-Date" instead?

Screen Shot 2022-04-06 at 3.50.29 PM.png

62 0 7

Hi, I am trying to follow the steps but my Theme doesn't have cart-template.liquid neither does it have cart.liquid. I am using the Focal Theme. Someone should please help.

Shopify Partner
5 0 0

@hope8 Yes, if this is a custom property you added to code or a default input from theme developer. You can change the name of the input i.e. <input name="properties[property-name-you-want]" > 

Shopify Partner
5 0 0

@Folake1 I would start with looking in product-form-template

New Member
1 0 0

I can't get the cart attributes to show up in my packing slip. No idea why. The attribute shows up in the order under Additional Details. I put in the following Liquid into my packing slip template but nothing shows up in there..

{% for attribute in attributes %}
{{ attribute | first }}: {{ attribute | last }}<br>
{% endfor %}


Also not sure what "first" and "last" are referring to.

Shopify Partner
3 0 1

I've had the implemented for a while but am now getting a "There was an error while updating your cart. Please try again." error when a user starts to type in the fields. The field input is not saved. When we type it looks like the page is trying to update and not registering all our keystrokes. Has anyone else run into this issue/have a solution?

Video demo of issue:

New Member
2 0 0

November 2022 and this tutorial is still valid! 

One minor correction. Modern 2.0 themes do not have <form> tags in the template, so you will need to add ...form="cart"... to each field, otherwise shopify will not acknowledge the attribute content.