Customizing the Side Cart

7 min read
Important:
  • We're in the process of releasing the Side Cart, which replaces the Mini Cart.
  • This article is relevant for Wix Stores, Wix Bookings, and Wix Restaurants Orders (New).
The Side Cart is a preview of the Cart Page, which opens on the side of your site pages. Customers can get to the Side Cart by clicking the Cart Icon or the "Add to Cart" button.
Screenshot of the Side Cart
In this article, learn more about:

Differentiating between the Side Cart & Mini Cart

We are in the process of rolling out the Side Cart, which is an updated version of the Mini Cart. The Side Cart is fully customizable and can be viewed on a mobile device. 
Note that only the Side Cart can be accessed from the Pages and Menu on the left side of your editor. 
In addition, when you click the Side Cart in your editor (seen below on the left), a toolbar appears. The Mini Cart (seen on the right) doesn't have this toolbar. 
Screenshots of the Side Cart and the Mini Cart side by side

Accessing the Side Cart in the Editor

If you're using only 1 business solution, you access the Side Cart through that business solution page section in your editor. For example, if you use only Wix Stores, you'll find the Side Cart under Store Pages

However, if you use, for example, Wix Stores and Wix Bookings, the Side Cart is found under Cart & Thank You.
Wix Editor
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Select the relevant business solution (Store Pages, Bookings Pages or Restaurant Pages), or select Cart & Thank You.
  4. Select Side Cart.

Setting the Cart Icon to open the Side Cart

You can choose what happens when a customer clicks the Cart Icon. It can direct customers to the Side Cart or send them straight to the Cart Page.

To set what happens when the Cart Icon is clicked:

  1. Click the Cart Icon in your editor.
Screenshot of the Cart Icon
  1. Click Settings.
  2. Select the Settings tab.
  3. Select an option:
    • Show Side Cart: When customers click the cart icon, the Side Cart opens on the right. From there, they can click View Cart to go to the Cart Page or Checkout to move directly to purchasing their order.
    • Open full Cart page: When customers click the cart icon, they're directed to the Cart Page.

Setting the "Add to Cart" button to open the Side Cart

You can set what happens when a customer clicks the "Add to Cart" button.  The "Add to Cart" button can be set to direct to the Side Cart or to any of three other options.
Tips:
  • This option is relevant only for Wix Stores.
  • The button can be displayed in the Product Page, in the Category Page, or in a gallery.
Screenshot of the Product Page

To set what happens when the "Add to Cart" is clicked:

  1. Click the Product Page, Category Page, or a Grid Gallery in the Editor.
    Tip: The button on each of these can be customized separately.
  2. Click Settings.
  3. Click the Settings tab.
  4. Under Add to Cart Button, make sure the Show Button toggle is enabled.
  5. Under When button is clicked, select an option:
    • Show success pop-up: A pop-up notification appears.
      Note: The success pop-up doesn't appear on mobile. Mobile customers are directed to the Cart Page.
    • Open side cart: Side cart opens on the side of the screen.
    • Go to cart page: Customers are taken directly to the cart page.
    • Stay on page: Customers stay on the current page. The button displays a checkmark to indicate that the product was successfully added. 

Customizing the Side Cart

Make changes to the text and design of the Side Cart so that it reflects your brand's look and feel.
Tip:
To view the Side Cart with items while customizing it, click Preview at the top right of your editor, add an item (e.g. a product or service), then Back to Editor to exit preview mode.

To customize the Side Cart:

  1. Click the Side Cart in your editor.
  2. Click Settings.
Screenshot of the Wix editor with part of the Side Cart visible and the Settings button outlined
  1. Customize the Side Cart using the available options:
    • Settings: Show or hide any of the Side Cart elements.
    • Design: Customize the colors, fonts, opacity levels and more.
    • Text: Edit the default text.
  2. Customize the overlay over the rest of the page:
    1. Click anywhere on the page outside of the Side Cart.
      Screenshot of part of the Side Cart in the Wix editor
    2. Click Change Background.
    3. Click Settings and customize the overlay.
  3. Set what happens when customers click outside of the Side Cart:
    1. Click anywhere on the page outside of the Side Cart.
    2. Click Set Up Overlay.
    3. Click the Clicking closes lightbox toggle to enable or disable it:
      • Enabled: When customers click outside of the Side Cart, the Side Cart closes. Customers can also close the Side Cart by clicking the "X" in the top corner.
      • Disabled: When customers click outside of the Side Cart, nothing happens. Customers can close the Side Cart by clicking the "X" in the top corner.
  1. When you're done, click Exit Mode.
Screenshot of the Wix editor with part of the Side Cart visible and the Exit Mode button outlined
  1. (Optional) You can switch to the mobile editor and customize the Side Cart on mobile.
    Tip: Customization you make to the mobile editor don't affect the Side Cart on desktop.

FAQs

Click a question below to learn more.

Did this help?

|