A cart drawer confirms what was added and gives the shopper a route to checkout. These Shopify examples also use that space for shipping details, gift messages and extra products. Compare how each keeps the order readable as those tasks accumulate.
GSI Outdoors puts the item thumbnail, title, price and quantity controls in a right-side drawer. A shipping-progress message sits above the item, with a compact recommendation row below. The estimated total and checkout button finish the order summary. The dimmed page leaves some browsing context visible while the customer checks what they added.
For your store
Keep the added item and its editable details easy to find.
Heart's drawer opens after an item is added, without a page reload. It pairs shipping progress with an order-note prompt for brewing or grind requests. The field has a specific use for coffee fulfillment. A store adopting it needs to be clear about which requests its team can act on.
For your store
Use order notes for instructions the fulfillment team can carry out.
Smith Teamaker includes variant selectors, subscription choices and add buttons within its cart recommendations. A customer can configure the suggested tea without opening another page. Those controls need room in a narrow drawer, particularly when the extra is a recurring purchase. The items already ordered must remain distinguishable from the recommendations.
For your store
Keep recommendation options readable and separate from the current order.
Athletic Brewing combines item controls with a gift-message field, membership information and a recommendation carousel. The gift field expands when needed, leaving more space for ordinary orders. Its label keeps the task discoverable even while the field is closed. Checkout needs to remain easy to find below the added content.
For your store
Let occasional tasks expand from clear labels.
After a suitcase is added, Horizn Studios recommends small travel accessories in the drawer. Each has an add button, so the customer can build out the order from the same panel. The relationship to the luggage is easy to recognize. A short selection also leaves room to review the changed total.
For your store
Recommend extras whose connection to the main purchase is clear.
Jonathan Adler's drawer concentrates on the selected item and includes the order total in the checkout button. The captured version has no shipping-progress bar or recommendation row. It is a compact confirmation for the purchase. If the same total is repeated elsewhere, quantity changes need to update both figures together.
For your store
A cart can finish its job with a clear item summary and total.
Slowdown Studio places expandable Note and Shipping sections beneath the editable item. Recommended throws occupy a neighboring pane with their own add buttons. This separates the order's practical details from further shopping while keeping both nearby. On a narrow screen, an expanded field still needs to leave a clear route to the total and checkout.
For your store
Group order notes and shipping under explicit labels.
House of Spoils highlights membership savings inside a direct cart summary. The captured drawer has no cross-sells or shipping-progress bar. The message explains a price benefit relevant to the current order, so the membership terms need to be understandable from that context. A badge alone would leave the customer to infer how the saving works.
For your store
Explain how membership affects the price shown.
DedCool shows an automatic fragrance gift as a free line item below a tiered reward bar. A sample selector and travel-spray offer also appear beneath the purchased fragrance. The panel contains several promotional tasks, making the distinction between paid products, included gifts and optional additions especially important. Each needs a clear status near the order total.
For your store
Label included gifts and optional extras separately.
Allies of Skin places gift selection in an expandable cart section, with small add controls for the available samples. Shipping and gift thresholds are visible nearby. The customer can check eligibility and then choose a gift within the same drawer. The selected gift should be easy to distinguish from a choice still waiting to be made.
For your store
Show what a customer qualifies for and whether the gift has been selected.
Dinosaur Designs includes expandable shipping-estimate and discount-code sections in its drawer. The captured cart also requires a terms checkbox before checkout. These controls let customers investigate the order from the storefront, though the checkbox introduces another required action. A business considering this layout should establish why that requirement is needed.
For your store
Answer shipping questions early and give extra required steps a clear purpose.
Olli Ella's desktop cart has a neighboring recommendation pane. On mobile, the drawer focuses on the order and puts discount entry above the subtotal. The two versions allocate their space differently: the narrow screen keeps the practical order controls together while reducing the space given to additional shopping.
For your store
Prioritize item editing, discounts and totals in a mobile cart.
Appointed displays the chosen item's variant attributes alongside its price and quantity controls. A shipping-progress message appears at the top, followed by the subtotal and checkout. Format or layout can determine which stationery item a customer wants, so those attributes deserve readable text in the confirmation.
For your store
Make the chosen format or layout easy to check in the cart.
Experiment adds a qualifying gift as a separate zero-price item and places a bundle offer below the order. Listing the gift confirms that it is included. The offer's conditions still matter, especially when a customer removes the product that qualified for it. That change should leave the cart's contents and total understandable.
For your store
Confirm included promotions in the item list and explain their conditions.
Tower 28 puts a sample carousel beneath the purchased item, with an add button on each option. The shipping-progress message remains separate. The task has a clear starting point: choose one of the displayed samples. A selected state and an easy way to change the choice would complete that interaction.
For your store
Make it clear when sample selection is complete.
Start with the selected product, variant, quantity and total. Appointed makes the stationery format visible beside the item; that detail matters when similar-looking products have different page layouts. GSI Outdoors gives shipping progress and a recommendation their own places around the order. Neither task should make customers hunt for the item they just added.
Gifts and subscriptions need more explanation. DedCool distinguishes a free gift from paid fragrance, while Smith Teamaker puts subscription choices inside recommendations. Label what is already included, what still needs choosing and what will create a recurring charge. After any change, check the item list and total together.
The space an order needs is a better starting point than the number of extras a panel can hold. Jonathan Adler’s captured drawer is a compact confirmation with the total in the checkout action. Slowdown Studio has notes, shipping information and a neighboring recommendation pane. Those tasks take more room, especially on a phone.
Try the longest realistic order before choosing a layout. Change quantities, remove the last item and open every optional field. If important details become cramped, give customers a full cart page to review them. Check keyboard focus, closing and reopening too: the order should stay understandable when the shopper returns from browsing.
A drawer keeps shoppers beside the product they were browsing. A full cart page provides more room for complex orders. In either layout, customers need to edit items, check the total and find checkout easily.
Start with the product and variant, quantity and remove controls, totals and checkout. Add shipping details or extra products where they can be read without crowding those essentials.
Only if the threshold is accurate for the customer and its conditions are clear. A short shipping statement may be enough, particularly when eligibility varies by item or destination.
Separate included gifts from paid items and from samples that still require a choice. DedCool and Experiment list qualifying gifts as zero-price items; Allies of Skin and Tower 28 show selectable options. Recheck eligibility when the qualifying purchase changes.
Yes, as the Smith Teamaker capture shows, but make the recurring purchase choice and its terms clear before the customer adds it. Keep recommendations visually separate from items already in the order.
Give Fudge a goal and a reference. It suggests changes for your store, builds a draft in your Shopify theme and reports back. You review each change before it goes live.
See how the store editor works