Menu Cart Widget (Pro)

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




Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.