Cart
Use powerful Cart components to elevate the potential of your Webflow e-commerce site.
Please note that this section/document is still Work in Progress. It might be updated, revised, or changed entirely in the near future.
To begin customizing your bag page, head over to the 'Components' section within the Penni Cart App and make your way to the 'Bag 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.
Edit Product Cart Item
These fields are intentionally left blank (not hidden) to ensure smooth loading of your actual product data. Your encouraged to edit as you normally would in Webflow, although we recommend leaving them blank to prevent loading issues.
Image: Image Block - Product image
Text - Product Name: Text Block - For your product name
Text - Attributes: Text Block - Here youll be able to display attributes such as size, color, style, etc
Div Block - Price: Div Block - This displays both the quantity indicator and price of your product
Keys to a Successful Bag Page Design:
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.
Last updated
