Cart Settings

The Cart Behavior & Actions settings let you customize what happens after a product is added to the cart, how the cart drawer looks, and how you handle upsells, urgency elements, and more. These settings help improve the user experience and can directly boost your average order value.

Post-Add to Cart Action

Choose what happens when a customer adds a product to the cart:

  • Open Cart Drawer – Opens a side drawer cart without leaving the current page.

  • Redirect to Cart Page – Redirects the user directly to the cart page.

This setting controls the core shopping experience and lets you decide how smooth or focused the process feels.

Cart Drawer Customization

Shipping Bar

  • Shipping Bar Background: Set the background color of the shipping progress bar. Example: #ECECEC

  • Shipping Bar Height: Adjust the thickness of the bar (in px). Example: 7

  • Shipping Bar Fill Color: The color that fills the bar as the user gets closer to free shipping. Example: #FF4949

  • Free Shipping Message Color: Text color of the message shown near the progress bar. Example: #313131

  • Free Shipping Price Highlight: Highlight the free shipping threshold value. Example: #434343

Free Shipping Bar

Encourage higher cart values by showing how close customers are to free shipping.

  • Show Free Shipping Bar: Enable to display the bar in both minicart and main cart pages.

  • Free Shipping Threshold: Set the minimum cart total (e.g., 400) that unlocks free shipping.

Cart Page Enhancements

Offer Protective Packaging

Allow customers to add an optional product (like packaging protection) from the cart.

  • Select Protective Packaging Product: Choose any existing product from your store. Example: Basic Oversized T-shirt (used as a placeholder)

Cart Drawer Countdown Timer

Create urgency with a timer that appears after an item is added.

  • Enable Cart Drawer Countdown Timer

  • Countdown Text: e.g. Hurry up, checkout within

  • Countdown Time (minutes): 3

  • Countdown Numbers Color: #FF3E3E

  • Enable Transparent Background: Optional toggle

  • Border Color: #ECECEC

  • Border Radius: 27

  • Padding: 9

  • Margin: 10

You can also display this timer on the full cart page using the Display Timer in Cart toggle.

Product Recommendations

Show related or upsell products to increase average order value.

  • Recommendations Section Title: e.g. People also bought

  • Cart Drawer Recommendations:

    • Show inside minicart

    • Disable minicart recommendations

  • Show Recommendations on Cart Page: Enable or disable for the full cart view.

  • Recommendation Type:

    • Automatic Suggestions – Based on Shopify logic

    • Manual Pick – You manually choose the products

  • Choose Recommended Products: Add product handles (one per line):

    perlCopyEditessential-serum-presets-ii  
deep-house-production-pack-2024  
alpha-hiphop-trap-bundle

Instagram Call-To-Action

Promote your Instagram account directly in the cart area.

  • Enable Instagram CTA: Show a message encouraging users to follow you.

  • CTA Accent Color: Example: #2878FF

  • Instagram Profile Link: Example: https://www.instagram.com/loudlib.audio/

  • Instagram Icon SVG Code: Paste your custom SVG icon here to match your branding.

Summary

With these settings, you can:

  • Choose between a quick drawer cart or redirect flow

  • Motivate purchases with a free shipping bar

  • Create urgency through countdown timers

  • Offer upsells like protective packaging

  • Show product recommendations to increase value

  • Drive social engagement with an Instagram CTA

PreviousWishlistNextSocial Media

Last updated