Story theme
Story v2
Story v2
  • Story theme documentation
  • online store 2.0
    • The new experience
  • Header
    • Header styles
    • Toolbar
    • Navigation images
    • Image menus
    • Transparent header
    • Mega-menu navigation
    • Drop-down navigation
  • Sections
    • How to use sections
      • Adding a section
      • Hiding a section
      • Reordering sections
    • Section blocks
    • Complete list of sections and blocks in Story
  • Collections
    • Product badges
      • Sale badge
      • Savings badge
      • Sold-out badge
      • Custom badges
      • Badge settings
    • Collection filtering
      • Custom filter options
    • Collection sorting
    • Collection navigation
    • Feature image
  • Products
    • Upsell promotions
      • How to setup
      • Static upsell promotion
      • Custom upsell promotion
    • Product tabs
      • Static product tabs
      • Unique product tabs
    • Color swatches
    • Inventory countdown
    • Pre-order products
    • Size Charts
      • Static size chart
      • Unique size charts
      • Creating pages
    • Product image sizes
  • Cart
    • Cart styles
    • Shipping message
    • Estimate shipping calculator
    • Cart settings
  • Pages
    • Page navigation
    • How to use page templates
      • Story page templates when using a different theme
    • Contact page
    • Lookbook
    • Team
    • Timeline
  • Blogs
    • Blogs
    • Articles
  • Settings
    • Tile decoration
    • Enable container
  • Updates
    • Story Releases
    • Check your theme version
    • How to download latest version
  • Tips
    • Where to make CSS changes
    • How to add a line break in your headings
  • Advanced
    • Story tutorials
    • Remove Shopify link in footer
  • Contact
    • Share preview link
  • Earlier versions
    • Story v1
Powered by GitBook
On this page
  • Drawer style
  • Popup style
  • Page style
  • App compatible page
  1. Cart

Cart styles

Story includes a set of modern cart designs which have powerful functionality

PreviousProduct image sizesNextShipping message

Last updated 3 years ago

Story's high functionality cart designs include features like a free shipping progress bar to encourage shoppers to add more items to the cart, an upsell promotion, available stock messaging, clean and easy-to-use quantity options, and removing items from the cart.

Explore the different styles and features included with Story:

Drawer style

Popup style

Drawer and Popup carts

Supported:

  • Free shipping message with dynamic value and progress bar

  • Upsell promotions

  • Dynamic values for quantity changes and item removal

  • Estimate shipping calculator

  • Cart notes, message to seller

  • Activated when each item is added to the cart (slideout or popup)

Not suitable for:

  • When using third-party cart-related apps that conflict with functionality

  • Displaying quick checkout buttons like Apple Pay, Amazon Pay, PayPal (these buttons by default appear in the next screen, the main checkout)

Page style

The page style cart is ideal for a full-screen cart and is not automatically activated when items are added to the cart. This can be useful for customers who are adding multiple items to the cart without the distraction of the cart appearing each time.

Page style cart

Supported:

  • Free shipping message with dynamic value (located above subtotal)

  • Dynamic values for quantity changes and item removal

  • Estimate shipping calculator

  • Cart notes, message to seller

  • Can display quick checkout buttons like Apple Pay, Amazon Pay, PayPal (removes from the next Checkout screen)

Not supported:

  • Upsell promotions

Cart is manually activated by clicking the cart icon. Does not automatically activate each time an item is added to the cart. A checkmark is used to inform the customer that an item has been successfully added to the cart.

App compatible page

This option is designed to be used with other third-party apps that take control of the cart or have special code used in the cart and cannot use dynamic features of the Story cart. Use this cart style for the most compatibility with apps or custom coding done by developers.

App compatible cart

Supported:

  • Cart notes, message to seller

  • The best option for stores that use cart-related apps or custom code

Not supported

  • Free shipping message with dynamic value and progress bar

  • Upsell promotions

  • Estimate shipping calculator

  • Uses an Update cart link to refresh quantity and removal of items in the cart

  • Cart is manually activated by clicking the cart icon. Does not automatically activate each time an item is added to the cart. A checkmark is used to inform the customer that an item has been successfully added to the cart.

Modern slide-out design, activates when item is aded to the cart
Center of screen popup design, activates when item is added to cart
Full page cart with dynamic functionality
Most compatible with third-party apps and custom coding