Pro Side Cart

The Side Cart module automatically displays an animated sliding cart in your WooCommerce store whenever a customer adds a new product to the cart.

The side cart slides into the screen from the right and gives your customers instant visual feedback. They can also edit the contents of the side cart and proceed to the Cart or Checkout page if they want to.

You can configure where you want to show the side cart in your WooCommerce store (you can toggle it on and off for your Shop and catalog pages, your single product pages, and your Cart links/icons in the menu and other places).

In the screenshot below, you can see what the side cart looks like on the Shop page of a WooCommerce store (created with the free Beauty demo of our Botiga theme):

Frontend view of the side cart added by Merchant Pro, screenshot

In the screencast video below, you can also watch how the side cart appears on the screen and how the customer can proceed to the Cart page (alternatively, they could also proceed straight to the Checkout page or close the side cart):

Now let’s see how to configure and enable Merchant Pro’s Side Cart module.

1. Open the Side Cart Module

First, open your Merchant dashboard by clicking the Merchant menu in the left sidebar of your WordPress admin area.

Find the Reduce Cart Abandonment section, and click the Side Cart module to open its settings page:

Location of the Side Cart module on the Merchant dashboard of the WordPress admin area, annotated screenshot

2. Configure the Settings

On the admin page of the Side Cart module, you’ll find two groups of settings — we recommend that you review and configure each option before activating the module:

  1. Settings – Here, you can define where you want to show the side cart in your WooCommerce store. You can display it on your Shop and catalog pages, on your single product pages, and whenever the customer clicks any of your Cart icons or menu items (a.k.a. on cart URL click).
  2. Side Cart Settings – This group of options lets you customize the design of your side cart, respectively its width and the colors of each of its elements (e.g. title, content, buttons, etc.).
Settings of Merchant Pro's Side Cart module, screenshot

Once you have configured all the settings, click the Save button in the top-right corner of the page.

3. Enable the Side Cart Module

To activate the module, click the Enable button at the top of the page:

Location of the Enable button on the Side Cart module's settings page, annotated screenshot