> For the complete documentation index, see [llms.txt](https://help.brickspacelab.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.brickspacelab.com/paper/sections/sitewide/cart-drawer.md).

# Cart drawer

### Section overview

The cart section provides a slide-out drawer and alert popup for displaying the shopping cart contents and checkout functionality in a Shopify store.

#### Common use cases

* Main shopping cart experience for e-commerce websites
* Cart upsell opportunities to increase average order value
* Cart progress bar to encourage customers to reach free shipping thresholds
* Quick checkout process with different button behavior options

#### Usage tips

* Configure the progress bar threshold to encourage higher purchases
* Utilize cart upsells to promote related products at the checkout stage
* Customize sidebar blocks for important shipping, return, or promotion information
* Mobile responsiveness is built-in with different layouts for mobile and desktop views, particularly in the upsell slider section

### Section settings

| Setting                       | Description                                                             |
| ----------------------------- | ----------------------------------------------------------------------- |
| Top bar color scheme          | Sets the color scheme for the top bar of the cart drawer                |
| Top bar color border          | Determines the border style for the top bar                             |
| Top bar color button          | Sets the style for buttons in the top bar                               |
| Main section color scheme     | Sets the primary color scheme for the main cart area                    |
| Secondary background          | Sets the color scheme for secondary elements within the cart            |
| Main color border             | Determines the border style for main cart items                         |
| Enable cart note              | Allows customers to add notes to their order                            |
| Enable cart share             | Enables functionality for customers to share their cart                 |
| Show cart subtotals           | Shows subtotal breakdowns including discounts                           |
| Bottom bar color scheme       | Sets the color scheme for the bottom bar of the cart drawer             |
| Bottom bar color border       | Determines the border style for the bottom bar                          |
| Bottom bar color button       | Sets the style for buttons in the bottom bar                            |
| Cart button behavior          | Choose between directing to checkout or cart page                       |
| Checkout disclaimer           | Add a disclaimer text below the checkout button                         |
| Show continue shopping button | Displays a button to continue shopping                                  |
| Show button prices            | Shows prices within checkout buttons                                    |
| Sidebar color scheme          | Sets the color scheme for the sidebar blocks                            |
| Sidebar color border          | Determines the border style for sidebar blocks                          |
| Progress bar threshold        | Set the threshold amount to reach for free shipping or other promotions |
| Progress bar success          | Message displayed when the progress bar threshold is met                |
| Enable progress bar           | Toggles display of the progress bar feature                             |
| Checkbox upsell ID            | Variant ID for the upsell product checkbox                              |
| Label                         | Text displayed for the upsell checkbox                                  |
| Cart upsell products          | Collection to use for upsell product slider                             |
| Button label                  | Text for the button shown when cart is empty                            |
| Button URL                    | URL that the empty cart button links to                                 |

### Block settings

#### Content

These blocks appear in the sidebar of the cart drawer and can be used to provide additional information or promotional content.

Block limit: 4

| Setting | Description                                        |
| ------- | -------------------------------------------------- |
| Icon    | 64px icon image to display at the top of the block |
| Heading | Title text for the content block                   |
| Content | Rich text content for the block                    |


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://help.brickspacelab.com/paper/sections/sitewide/cart-drawer.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.