How to set up the cart header and footer

In this article:

• Change the cart title
• Change the checkout button
• Show the savings on the checkout button

The header is the top line of the cart drawer with the cart title and the close button. The footer is the Checkout button at the bottom. Both are always shown, and you can change their texts and colors.

Change the cart title

1. Open ShopCart and click Edit in the Cart Drawer card.
2. Click Header.
3. In Cart title, enter your title. Keep {{cart_items_quantity}} to show the number of items, for example "Cart 3". Click {} in the field to insert a variable.
4. Click Save at the top of the editor.

On the Styles tab you can change the Background color, Text color and Close button color.

Change the checkout button

1. Click Footer.
2. In Summary text, enter the text of the checkout button. Keep {{cart_total_price}} to show the cart total, for example "Checkout • $1,329.95".
3. Click Save.

When a product has a compare-at price or a discount applies, the button also shows the old total crossed out.

On the Styles tab you can change the footer background and the colors of the Checkout button.

Show the savings on the checkout button

Select Show discount. A Discount text field appears with Save • {{cart_total_discount}}, and the button shows how much the customer saves, for example "Save • $100.00".

✔️ Next step

Check our articles to learn more about the app's functionality:

• How to customize the cart drawer design
• How to set up products in the cart
• How to translate the cart

Updated on: 20/10/2026