Cart items

Cart items

Cart items block

The Cart items block displays product images and details for items added to the cart. You can customize how item product images are displayed, and choose to show unit prices, item savings, and a low inventory warning.

Note: Cart items are always placed in the main column.
image

Item images

Every cart item displays the product image next to the product details. You can change the aspect ration (shape) and thumbnail size of the cart item images.

icon
STEPS

In your theme editor (Customize):

  1. Click the Header cart icon, and click the Edit your cart button.
  2. Click on the Cart items block to open the settings.
    3. image
  3. Change the Thumbnail image aspect ratio to crop all cart images to the same shape.
    4. Select Natural to display the original shape of your product image.
  4. Change the Thumbnail size of the cart images.
    5. Choose Small, Medium, or Large
  5. Click Save.

Unit prices

If you’ve added unit prices to your products in your Shopify admin, you can display the Unit price next to the total price.

image
icon
STEPS

In your theme editor (Customize):

  1. Click the Header cart icon, and click the blue edit button.
  2. Click on the Cart items block to open the settings.
    3. image
  3. Choose whether to show single quantity prices.
    4. In some countries, it is required by law to display unit pricing for products.
  4. Click Save.

Item savings

For discounted products, you can show Item savings to let customers know how much they’re saving.

icon
STEPS

In your theme editor (Customize):

  1. Click the Header cart icon, and click the blue edit button.
  2. Click on the Cart items block to open the settings.
    3. image
  3. Choose whether to Show item savings.
    4. Display next to item price.
  4. Click Save.

Low inventory warning

A Low inventory warning message will appear next to cart items that have limited quantities. Displaying a low inventory warning can turn limited stock quantities into an advantage by conveying a sense of scarcity to increase conversion and quicker purchases.

Note: The low inventory warning can also be enabled for the Quick purchase bar.
image
icon
STEPS

In your theme editor (Customize):

  1. Click the Header cart icon, and click the blue edit button.
  2. Click on the Cart items block to open the settings.
  3. Click the Enable low inventory warning.
    4. Inventory tracking must be turned on in your Shopify Admin.
  4. Use the Low inventory threshold slider to select the number of products that will trigger the low inventory warning.
    5. Choose between 5 and 50.
  5. Click Save.

Live traffic label

The Live traffic label shows how many other customers currently have the same item in their cart. This label can convey a sense of popularity and urgency, especially when paired with the low inventory warning.

Note: The Live traffic label can also be enabled for the Quick purchase bar.
image
icon
STEPS

In your theme editor (Customize):

  1. Click the Cart items block to open the settings.
  2. Scroll down to the bottom of the settings.
  3. Select the Enable live traffic label option.
  4. (Optional) Select Animate live traffic label to make the icon pulse.
  5. Change the Live traffic icon color.
    6. Select Default, Accent, or Accent inverse to use a color based on your theme settings.
    Select Override with custom colors to use a color that’s separate from your theme settings.
  6. Choose a different Live traffic icon from a selection of 50 free icons.
  7. Select Place warning labels inline to show the Low inventory warning on the same line.
  8. Click Save.

← Previous

Upsells