1. Home
  2. Docs
  3. Woo Essential Documentati...
  4. Modules Documentation
  5. Mini Cart

Mini Cart

Content Tab

Customers can check a summary of the items and pricing in their mini carts without leaving the current WooCommerce page. This can help customers stay on your website longer and gives them a quick way to view what’s in their shopping basket. Here we have described the settings of Mini Cart module below:

Content Tab > Mini Cart > Mini Cart Display

 In Mini Cart Display 3 options are available to display the Mini Cart.

  1. Hover: By hovering on Mini Cart your customer can easily check the mini cart and the product images along with Price and other necessary information before purchasing a product.
  2. Click : If you select this option then your customer can find details of the mini cart when they click on the mini cart.
  3. Fly Out: It is an amazing option. From here you can select it during setting each option, and you just need to select left or right. Then you can notice a nice mini cart will appear on the left or right.

Content Tab > Mini Cart > Title Text:

Here you can replace the word “Items Selected” by using your required words or using your own language.

Content Tab > Mini Cart Window Background:

Customers need to check their minicart window with proper information. That’s why the minicart’s background plays a vital role. So, Use this option to style the Mini Cart window background. From here you can easily change the background color as well as the background gradient.

Design Tab

Design > Cart Icon Design

Icon Size: Increase or decrease the size of the icon from here.

Icon Background Size: Resize the background of the icon using this option.

Icon Alignment:  Align the MiniCart’s position from left to right or in the middle from here.

Icon Color:From here you can define a custom color for the Icon color.

Icon Background Color: Select the background color from here.

Style the Mini Cart’s icon by using the Icon Rounded corners, border styles, border width, border color, border style.

Mini Cart Window:

Mini Cart Window > Design :

Window width: Change the Window’s width by using this option as per your requirement.

Remove Button Color, MiniCart Item Border Color, MiniCart Window Background

MiniCart Rounded Corners/Border Styles, Border Width, Border Color, Border Styles
Such amazing options are available in the Mini Cart Window Design option.

MiniCart Window > Heading Font

Design the Heading Title Font,  Font Weight, Font Style, Text ALignment, Text color, Text Size, Letter Spacing, Line Height, Text Shadow as per your requirement.

Product Text:

Product Text > Product Name:
Style the products name font, text alignment, font style, text color, text size and shadow, letter spacing, height as per your requirement.

Product Text > Quantity Font:
In this option, you’re getting an amazing option where you can change the style of
Product quantity’s font, text alignment, font style, text color, text size and shadow, letter spacing, height as per your requirement.


MiniCart Image: Style the product images from here, which your customer can see in the mini cart. Here you can resize the image, image rounded corners, border styles, border width, border color, border style, box shadow etc.

Button: 2 types of buttons are available in Mini Cart.

  1. View Button
  2. Checkout Button

Button > View Button: View Button’s Background Color,Font, Font Weight, Font Style, Text Alignment, Text Color, Text Size, Letter Spacing, Line Height, Text Shadow, View Cart Corners, View Cart Border width, View Cart Border Color/ View Cart border style.

Button > Checkout Button: Style the checkout button’s background color, font, text size, line height, alignment etc from here easily.

Subtotal:

Subtotal> Subtotal: Style the subtotal’s background color, font, text size, line height, alignment etc from here easily.

Subtotal > Subtotal Price: Design the subtotal price’s background color, font, text size, line height, alignment etc from here as you require.

Empty Cart:

Assume a customer  has bought nothing, then his cart will remain empty. Style that empty cart’ font, font weight, size, alignment from here easily.

Count:
After adding products your customer can notice the Product count number on the mini cart, and here you can define a custom color for counter color, you can resize it’s size, font, text as per your requirement.

Mini Cart Sizing: You have the freedom here to change the size of the mini cart module
as per your requirement. You can change the height,width as well as align the module as you need.

How can we help?