The Cart Footer element is the closing section of your cart drawer. It provides essential information like the order total, applied discounts, and the primary Checkout button. Since it appears at the bottom of the cart, it’s the customer’s final step before proceeding to checkout, making it a crucial conversion driver.
The element is pre-configured by default, ensuring it works out of the box, but it can be fully styled and customized to match your store’s brand.
Inserting the Cart Footer Element
Open the Insert Panel
Navigate to the Insert Panel in Instant.
Locate the Footer Element
Go to Elements → Cart.
Hover over the Cart category to expand the options.
Select Cart Footer.
Drag into Cart Layout
Drag and drop the Footer element into your Cart Drawer Layout on the Instant canvas.
It will appear pre-configured and ready to go.
Configuration
Estimated Total
By default, the footer displays the cart’s estimated total.
This updates dynamically as items are added or removed.
Discounts & Vouchers
The footer includes a repeater that shows applied discounts, vouchers, or promotional codes relevant to the order.
Checkout Button
The footer comes with a Checkout button that has a default action already applied.
By default, this button directs customers to the Shopify checkout page.
Styling
Like other elements, the footer can be styled to match your branding (typography, colors, spacing).