---
schema_version: "1"
id: 877d1d791ec0b0bef4fc5b5d043a1d308c34fae5f3f3e1e5a37e3ee663f7c12a
title: Enable Cart Preview and Checkout from the Cart Icon in a Commerce Store
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/commerce/264-0-0/comm_cart_badge_mini_cart.md
canonical_url: https://help.salesforce.com/s/articleView?id=commerce.comm_cart_badge_mini_cart.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 4ccd13f78b3f5703fcda0cbd46eb5b560a97a15242c4df1186cc6e864ffa07bd
description: Let customers go to the Cart page, preview their cart, or complete their purchase on any page in your B2B store by including a mini cart display. In Experience Builder, customize the Cart Badge component to add these features.
products:
  - Commerce
  - B2B Commerce
release: "264"
---
# Enable Cart Preview and Checkout from the Cart Icon in a Commerce Store

Let customers go to the Cart page, preview their cart, or complete their purchase on any page in your B2B store by including a mini cart display. In Experience Builder, customize the Cart Badge component to add these features.

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition"><colgroup><col></colgroup><tbody><tr class=""><td class="slds-cell-wrap" style="vertical-align:top;"><a href="https://help.salesforce.com/s/articleView?id=commerce.comm_editions.htm&amp;language=en_US" target="_blank">View supported editions</a>.</td></tr></tbody></table>

[Which Salesforce Commerce Product Do I Have?](https://help.salesforce.com/s/articleView?id=commerce.comm_what_product.htm&language=en_US)

![Note](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-commerce-comm-264-0-0-production-enus/d863e308-482a-4dfa-8d20-2a94737d394a/images/icon_note.png)

Note For stores created after Spring ‘25, when cart item quantities are updated, the Cart page clears to recalculate. As a result, customers see a blank page with a loading spinner before the Cart page reloads.

1. In the navigation sidebar, select a store from the **Store** dropdown.
2. Select **Website Design**, and then click **Experience Builder**.
3. On your store’s Home page, customize the Cart Badge component. To display settings for new features like the mini cart, replace your Cart Badge component with the new component.
    
    The Cart Badge component is embedded in your store’s header and appears on every page on your site. It displays the cart icon and a badge to show the number of items in a cart. However, the My Profile page uses a different version of the Cart Badge component, so make sure to customize both versions.
    
    1. To show the number of items in a customer’s cart on the cart icon, select **Show number of items in cart**. From the dropdown, select **Total Items in Cart** or **Total Products in Cart**.
        
        Total items counts all of a customer’s cart items, and total products displays only the number of unique items in the customer’s cart. If your store has Faster Add-to-Cart enabled, you can’t select Total Products in Cart. See [Improve Product Page Performance in a B2B Store](https://help.salesforce.com/s/articleView?id=commerce.comm_faster_add_to_cart.htm&release=264.0.0&type=5 "To speed up the shopping experience in your LWR store, turn on the Faster Add-to-Cart feature. By splitting processing time across Product and Cart pages, Faster Add-to-Cart improves the response time on a Product page when a customer adds an item to their cart. This setting is enabled by default for B2B stores created in Winter ’24 or later and D2C stores created between Winter ’24 and Spring ’25.").
    2. To customize the cart preview, open the Mini Cart section.
        
        The mini cart is enabled by default for stores created after Winter ’25. It shows customers a sliding cart preview and checkout button when they click the cart icon. If you disable the mini cart, customers go directly to the Cart page when they click the cart icon.
    3. To let customers continue shopping from the mini cart, select **Show continue shopping button**.
    4. To let customers navigate to the Cart page from the mini cart, select **Show view cart button**. To bypass the Cart page during the checkout process, don’t select this option.
    5. (Optional) If you have Commerce Einstein enabled, to recommend additional products to customers, select **Show product recommendations.** See [Commerce Einstein](https://help.salesforce.com/s/articleView?id=commerce.comm_commerce_einstein.htm&language=en_US).
        
        If you have a store created before Summer ’25, drag a new version of the Cart Badge component onto your page to pull in recommendations data.
4. Preview and publish your changes.

#### See Also

- [LWR Store Components](https://help.salesforce.com/s/articleView?id=commerce.comm_components.htm&language=en_US)
- [Design the Cart Page in a B2B or D2C Store](https://help.salesforce.com/s/articleView?id=commerce.comm_cart_customize.htm&language=en_US)