Displaying Product Fields on the Checkout Page

Overview

You can easily show field data from products in your cart. This is useful if you want to show information at the last minute about that product. In this example, we will be printing information about shipping times, complete with a default message. This field already prints on one of our product pages, but we want it to show to the customer when they are in their cart ready to order.

Note: This tutorial does not add form fields to the cart for the customer to enter data into. This tutorial prints extra data about a product when the product is viewed in the cart.

Cart.png

Setup

In this example, we have a text field called Shipping Info that will give users a little extra insight into how long a product usually takes to ship. Note that no extra information is stored in the field.

2019-03-19_1316.png

Method 1, Printing the Raw Value

In the theme code section in Shopify, go to Sections > cart-template.liquid (or wherever your cart template is). Search for item.product.title, and paste the following to print the raw metafield value.

<code><br /> {{ item.product.metafields.custom_fields["shipping_info"] }}

2019-03-28_1219.png

2019-03-26_1525.png

Method 2, Printing A Snippet from the Code Editor

Using this method, we want to print some custom logic that we entered for our field in the app's code editor. To do that, we'll simply use the include statement instead for the metafield value.

Field_Settings.png

In the theme code section in Shopify, go to Sections > cart-template.liquid (or wherever your cart template is). Search for item.product.title, and paste the following to print the entire include statement.

{% assign product = item.product %}

<br />

{% include 'custom_fields.products.YOURMACHINENAMEHERE' %}

Cart_Pasted.png

Cart.png