# Cart Templates

{% hint style="warning" %}
Please note that this section/document is still <mark style="color:purple;">**Work in Progress**</mark><mark style="color:purple;">.</mark> It might be updated, revised, or changed entirely in the near future.&#x20;
{% endhint %}

To begin customizing your cart page, head over to the 'Components' section within the Penni Cart App and make your way to the 'Cart Components' segment. This section is dedicated to enriching the shopping bag experience with two crucial components:

* **Products List:** A comprehensive display of all items a customer has added to their cart, providing a clear and concise overview.
* **Order Summary:** Offers a quick snapshot of the order's essential details, including shipping, tax, and subtotal, ensuring customers have all the information they need at a glance.

These components come unstyled, granting you the freedom to design them according to your brand's identity on the Bag Page, which Penni Cart sets up automatically during installation.

### <mark style="color:purple;">**Keys to a Successful Bag Page Design:**</mark>

* **Responsiveness:** Ensure your cart adapts smoothly across devices for a seamless shopping experience.
* **Ensure Clarity:** The Products List and Order Summary should be straightforward, fostering a hassle-free checkout experience.
* **Preserve Required Attributes:** Our attribute grid below highlights the essential attributes for each component. Be mindful not to remove these to maintain functionality.
* **Brand Alignment:** Tailoring the cart's design to reflect your brand's identity not only elevates the user experience but can also significantly boost engagement and sales.

Embark on customizing your Bag Page, equipped with the necessary tools for a design that's not only functional but also a true reflection of your brand within your Webflow store.


---

# Agent Instructions: 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:

```
GET https://docs.pennicart.io/templates/cart-templates.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.