The Menu Cart widget enables you to place a WooCommerce cart icon in your menu or anywhere on your page.
Content
Menu Icon
1. Icon: Select the icon to show, choosing from Cart, Basket, or Bag, in Light, Medium or Solid designs.
2. Items Indicator: Select the type of indicator to use for number of items in the cart, choosing from None, Bubble, or Plain
3. Hide Empty: Slide to YES to hide items indicator if cart is empty
4. Subtotal: Show or Hide the cart’s current subtotal
5. Alignment: Align the menu cart to the left, right, or center
Style
Menu Icon
Normal | Hover
1. Text Color: Choose the color of the subtotal text
2. Icon Color: Choose the color of the cart icon
3. Background Color: Choose the background color of the widget container
4. Border Color: Choose the border color of the widget container
5. Border Width: Control the thickness of the border around the widget container
6. Border Radius: Set the border radius to control corner roundness
7. Typography: Change the typography options for the subtotal text
Icon
1. Size: Adjust the size of the cart icon
2. Spacing: Adjust the amount of space between the cart icon and the subtotal text
3. Padding: Change the padding settings of the widget container
Items Indicator
1. Text Color: Choose the color of the number of items in the items indicator
2. Background Color: Choose the background color of items indicator
3. Distance: Set the distance between the icons indicator and the subtotal text
Note: When the Menu Cart is clicked, a cart overlay slides open. The following options control the design aspects of the cart overlay.
Cart
1. Divider: Show or Hide the divider line after each item in the cart overlay
2. Remove Item Icon: Show or Hide the icon that allows users to remove an item from the cart
Subtotal
1. Color: Choose the color of the subtotal text in the cart overlay
2. Typography: Change the typography options for the subtotal text in the cart overlay
Products
Product Title
1. Color: Choose the color of the product title in the cart overlay
2. Typography: Change the typography options for the product title in the cart overlay
Product Price
1. Color: Choose the color of the product price in the cart overlay
2. Typography: Change the typography options for the product price in the cart overlay
Divider
1. Style: Select the style of the divider above and below the subtotal in the cart overlay, choosing from none, solid, double, dotted, dashed, or grooved
2. Color: Choose the color of the subtotal divider in the cart overlay
3. Weight: Set the thickness of the subtotal divider
4. Spacing: Set the spacing between subtotal dividers and the subtotal text
Buttons
1. Layout: Choose the layout of the buttons in the cart overlay, either Inline or Stacked.
2. Space Between: Set the amount of space between the cart overlay buttons
View Cart
1. Text Color: Choose the color of the Show Cart button text in the cart overlay
2. Background Color: Choose the background color of the Show Cart button in the cart overlay
3. Border Color: Choose the border color of the Show Cart button in the cart overlay
4. Border Width: Control the thickness of the border around the Show Cart button in the cart overlay
Checkout
1. Text Color: Choose the color of the Checkout button text in the cart overlay
2. Background Color: Choose the background color of the Checkout button in the cart overlay
3. Border Color: Choose the border color of the Checkout button in the cart overlay
4. Border Width: Control the thickness of the border around the Checkout button text in the cart overlay
5. Typography: Change the typography options for both buttons in the cart overlay
6. Border Radius: Set the border radius for both buttons in the cart overlay