How to Set Up

What is the Sticky Cart?

The Sticky Cart is a floating button that stays visible on your store as customers scroll. When clicked, it opens the cart drawer instantly β€” so shoppers can review their cart without navigating away from the current page.

Why use the Sticky Cart?

  • Always accessible β€” A persistent cart button means customers can check their cart at any time, from any page.

  • Reduce cart abandonment β€” Keeping the cart one click away encourages shoppers to complete their purchase.

  • Fully customizable β€” Choose the layout, position, icon, colors, and behavior to match your store's design.

Requirements before using

  • You must have the AOV.ai Cart Drawer app installed and active.

  • The Cart Editor must be set up with at least the basic configuration.

How to Set Up?

Step 1: Enable the Sticky Cart

  1. Go to AOV.ai Cart Drawer > Sticky Cart.

  2. Toggle the Status to Active to enable the sticky cart button on your store.

Enable sticky cart

Step 2: Choose the Layout and Position

  1. Under Layout & Icon, select a layout:

    • Corner button β€” A circular floating button in the corner of the screen.

    • Side tab β€” A tab that sticks to the side edge of the page.

  2. Choose the Position β€” Left or Right side of the screen.

  3. Select an Icon that appears on the button (cart, bag, or other options).

  4. (Optional) Enter Button text to display a label next to the icon.

Layout and position settings

Step 3: Adjust Style and Spacing

  1. Under Style & Spacing, fine-tune the button's appearance:

    • Bottom distance β€” How far the button sits from the bottom of the screen.

    • Side distance β€” How far the button sits from the left or right edge.

    • Roundness β€” Control the corner radius of the button.

    • Icon size β€” Make the icon larger or smaller.

Style and spacing settings

Step 4: Customize Colors and Advanced Settings

  1. Set the colors for the sticky cart button:

    • Shape color β€” The background color of the button.

    • Icon color β€” The color of the cart icon.

    • Count badge color β€” The background color of the item count badge.

    • Count text color β€” The text color of the item count number.

  2. Under Advanced settings, configure behavior:

    • On click behavior β€” Choose between Open cart (opens the drawer) or Go to checkout page (redirects to checkout).

    • Device visibility β€” Show on all devices, Desktop only, or Mobile only.

    • Toggle Show item count badge to display the number of items in the cart.

    • Toggle Hide when cart is empty to hide the button when there are no items.

Colors and advanced settings

Step 5: Preview and Save

  1. Click Preview to see how the sticky cart button looks on your store.

  2. Once satisfied, click Save to apply your settings.

Preview and save

Your sticky cart button is now live. Customers will see a floating cart icon as they browse your store, making it easy to check out at any time! πŸš€

Last updated