Cart Launcher

Under construction

We’re still working on this knowledge base article and it’s subject to change. Thank you for understanding.

By default, the Drawer will always be available for your customers and customers can access it by clicking either the Floating Cart Launcher icon or by using the Cart Launcher shortcode.

Cart Launcher Shortcode

Options

The shortcode [cartpops_cart_launcher] has the following options:

[cartpops_cart_launcher subtotal="" indicator="" icon="" indicator_hide_empty=""]
NameTypeDefaultDescription
iconstringcpops-icon-shopping-cart-lineAn icon that will be displayed. See below for a list of icons. You can also create your own icon by passing a string other than the default icons (see tutorial below)
subtotalbooleantrueShow or hide the total
indicatorstring'bubble'Set the indicator type, choose from none, bubble, plain
indicator_hide_emptybooleanfalseHide or show the indicator when the cart is empty

Icons shipped with CartPops

Here’s a list of all the available icons.

  • cpops-icon-shopping-cart-outline
  • cpops-icon-shopping-cart-line
  • cpops-icon-shopping-cart-fill
  • cpops-icon-shopping-cart-2-line
  • cpops-icon-shopping-cart-2-fill
  • cpops-icon-shopping-bag-outline
  • cpops-icon-shopping-bag-line
  • cpops-icon-shopping-bag-fill
  • cpops-icon-shopping-bag-2-line
  • cpops-icon-shopping-bag-2-fill
  • cpops-icon-shopping-bag-3-fill
  • cpops-icon-handbag-line
  • cpops-icon-cpops-handbag-fill

Shortcode examples

The default shortcode

[cartpops_cart_launcher]

Simple cart with no indicator and subtotal

[cartpops_cart_launcher subtotal="false" indicator="none"]

Using a custom icon

Keep in mind

Custom development is outside the scope of our support. However, if you’re looking for more advanced support, our team is happy to refer you to a trusted source.

You can pass any string to the icon parameter in the shortcode and it will be added as a class to the <i> icon element.

Custom icon example

The shortcode
[cartpops_cart_launcher icon="my-custom-icon"]
The output of the icon will look like this:
<i class="my-custom-icon" aria-hidden="true"></i>
The CSS to create your icon
.cartpops-cart__toggle .cartpops-cart__container-icon i.my-custom-icon {
    background: url('https://yourdomain.com/wp-content/uploads/icon.png');
    height: 1.2rem;
    width: 1.2rem;
    display: block;
    background-size: contain;
}
The end result

Floating Cart Launcher

The documentation for the Floating Cart Launcher will come soon.

Menu Cart Launcher

The documentation for the Floating Cart Launcher will come soon.

It's time to improve your WooCommerce Cart

CartPops is a WooCommerce Add To Cart Popup, that helps every shop owner improve their user experience, increase conversions & maximize profits.

Was this page helpful?