Skip to main content
E-commerce

Cart Page Optimization: Where 30% of Revenue Hides

The cart is where customers decide to buy or bail. Most stores have a default cart and lose 30%+ of carts to friction. Here are the fixes that compound.

Vince Servidad
Vince Servidad
Performance Marketing Consultant
9 min read
Share:

After a customer adds to cart, they're 60–75% likely to abandon. The cart page is where you either confirm their decision or scare them away.

Most Shopify stores I audit have default cart settings — no upsells, no shipping calculator, no progress indicators. Easy fixes, big wins.

TL;DR

The 10 fixes:

1. Use a cart drawer, not a cart page.

2. Show free shipping progress bar.

3. Add 1–2 cart upsells.

4. Show estimated delivery date.

5. Express checkout buttons (Shop Pay, GCash).

6. Trust signals near checkout button.

7. Quantity edit and remove items easy.

8. Promo code field collapsed (don't tease discounts).

9. Subtotal + shipping breakdown clear.

10. Continue shopping link visible.

Cart drawer vs cart page

A cart drawer slides out from the side without leaving the current page. A cart page is a full-page reload.

For most ecom: cart drawer wins because it preserves the customer's browsing momentum.

Some stores need a cart page (B2B with complex orders, customizable products with options). For B2C: drawer.

Most modern Shopify themes have a built-in cart drawer. Enable it.

Free shipping progress bar

Show how far the customer is from free shipping:

> "Add ₱350 more to unlock FREE shipping!"

Use Vitals, Shopify's Shipping Threshold app, or theme-native settings.

Lift: +6–14% AOV, +3–8% conversion.

Cart upsells

In the cart drawer, show 1–2 complementary products:

  • "Pair this with: [travel-size]"
  • "Customers also bought: [product]"
  • Don't recommend products at >30% of cart value. Don't recommend more than 2.

    Lift: +4–12% AOV.

    Express checkout buttons

    Shop Pay, Apple Pay, Google Pay buttons in the cart:

  • Above the regular checkout button.
  • Skip the entire checkout flow for accelerated checkout users.
  • Conversion lift: 5–10%.

    Trust signals

    Near the checkout button:

  • "Secure SSL Checkout" lock icon.
  • Payment method icons (Visa, MasterCard, GCash, Maya).
  • Free returns badge (if offered).
  • Free shipping over ₱X.
  • Lift: +2–5% checkout completion.

    Promo code handling

    If you don't have promo codes running: hide the field entirely. Adding it teases customers to leave looking for codes online.

    If you have a code field: collapse it ("Have a code? Click here"). Out of sight = less leak.

    Estimated delivery

    Show a real date:

    > "Order in the next 2 hours, get it Wednesday."

    vs vague:

    > "Standard shipping 3–5 days."

    Lift: +3–8% conversion.

    Quantity controls

    Plus/minus buttons (not dropdown). One tap to adjust.

    Remove item: clear "X" or trash icon.

    These should be obvious and instant.

    Subtotal breakdown

    Clear lines for:

  • Items subtotal.
  • Shipping.
  • Discount.
  • Total.
  • If shipping shows as "calculated at checkout", customers worry. Show it transparently.

    Visible "← Continue shopping" link. Lets customers add more without losing cart.

    Don't make them hunt for it — link should be top-left of cart drawer.

    Mobile-specific cart

    On mobile, cart drawer should:

  • Take 80–90% of screen width.
  • Slide from right.
  • Have large, tap-friendly controls.
  • Sticky checkout button at bottom.
  • If your mobile cart is buried in a hamburger menu, you're losing 20%+ of mobile customers.

    Cart abandonment recovery

    The cart page is where you set up the abandoned cart flow:

  • Trigger: customer adds to cart, doesn't checkout in 1 hour.
  • Klaviyo flow: 3 emails over 48 hours.
  • SMS layer (4 hours after Email 1).
  • See Shopify Abandoned Cart Recovery for full setup.

    Common cart mistakes

    1. Default cart with 0 customization: missing all the lifters above.

    2. Heavy popups on cart: customers are about to buy. Don't interrupt.

    3. Showing related products as a giant grid: distracts from checkout intent.

    4. Hiding shipping cost until checkout: surprises = abandons.

    5. No account-creation OFF: forced sign-up is a 20%+ abandonment cause.

    Measuring cart performance

    Shopify Analytics:

  • Cart-to-checkout rate.
  • Cart abandonment rate.
  • AOV vs site average.
  • Healthy targets:

  • Cart-to-checkout: 50–70%.
  • Cart abandonment (to purchase): 25–40%.
  • If cart-to-checkout is below 40%, your cart UX has issues.

    Quick deployment

    Take a Saturday:

    1. Hour 1: enable cart drawer (theme settings).

    2. Hour 2: install/configure free shipping bar.

    3. Hour 3: set up Vitals or similar for cart upsells.

    4. Hour 4: add trust badges, express checkout buttons.

    5. Hour 5: rewrite shipping copy for clarity.

    6. Hour 6: test on real mobile and desktop.

    By Sunday night, cart is significantly upgraded.

    Want help with cart optimization?

    Cart UX is a system. My Shopify Expert service covers full funnel optimization. Or learn the system in the Shopify Course Philippines.

    Related reading:

  • Shopify Checkout Optimization
  • Shopify Abandoned Cart Recovery
  • Shopify Upsells and Cross-Sells
  • Vince Servidad

    Written by Vince Servidad

    I've spent over $26M on ads and built my own 7-figure brand from scratch. I don't just 'manage ads'—I build the growth systems that actually scale businesses profitably.

    Want More Marketing Insights?

    Get weekly tips, strategies, and case studies delivered to your inbox.

    Need help with E-commerce?

    Get hands-on support from a performance marketing consultant based in the Philippines.

    Related Articles