Cart Widget
Use the widget to add the cart.
Content
General
Type of Cart: Choose between Link, Popup and Canvas cart types.
Show Cart on: Choose the cart to be shown on Hover or on Click.
Button
Alignment: Choose between Left, Center or Right alignment for desktop, tablet and mobile.
Style: Choose between Icon, Text and text and Icon button styles and set them.
Counter: Set the counter for desktop, tablet and mobile. Choose between None, Absolute and Relative.
Relative counter allows to choose the Counter Type for desktop, tablet and mobile. The choice is between Plain and After button.
Using ‘After button’ type you can choose the Left or Right Counter position.
Subtotal: Slide to YES to show the subtotal.
Hide Empty Сounter : Slide to YES to hide products’ amount (counter) if empty.
Advance
Cart Title: Add the cart title here.
Cart Message: Add the cart message here.
Style
Button
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Button Color for Normal and Hover modes.
Background Color: Choose a Background Color for Normal and Hover modes.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set a button border radius.
Button Padding: Set a button padding for desktop, tablet and mobile.
Button Icon
Icon Color: Choose the Icon color here.
Size: Set the icon size for desktop, tablet and mobile.
Icon Spacing: Set the spacing between the icon and button for desktop, tablet and mobile.
Button Counter
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Button Counter Color.
Background Color: Choose a Button Counter Background Color.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set a Button Counter border radius.
Padding: Set a Button Counter padding for desktop, tablet and mobile.
Box Shadow: Choose desired settings from the dropdown.
Spacing Vertical: Set a Button Counter vertical spacing for desktop, tablet and mobile.
Spacing Horizontal: Set a Button Counter horizontal spacing for desktop, tablet and mobile.
Cart
Width: Set a Cart width for desktop, tablet and mobile.
Margin Top: Set the margin top for desktop, tablet and mobile.
Background Color: Choose a Cart Background Color.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Color: Choose a Cart Border Color.
Border Radius: Set a Cart border radius.
Cart Padding: Set a Cart padding for desktop, tablet and mobile.
Box Shadow: Choose desired settings from the dropdown.
Empty Cart
Alignment: Choose between Left, Center and Right alignment for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Color: Choose an Empty Cart Color.
Cart Subtotal
Alignment: Choose between Left, Center, Right and Justified alignment for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Cart subtotal color.
Background Color: Choose a Cart subtotal background color.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Color: Choose a Cart subtotal Border Color.
Border Radius: Set a Cart subtotal border radius.
Padding: Set a Cart subtotal padding for desktop, tablet and mobile.
Spacing Top: Set a Cart subtotal top spacing for desktop, tablet and mobile.
Cart Product
Max Height Container: Set a container max height for desktop, tablet and mobile.
Container Padding: Set a container padding for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Text Color: Choose a container color.
Background Color: Choose a container background color.
Product Padding: Set a product padding for desktop, tablet and mobile.
Product Image: Set the product image here, i.e. choose the Image position (left or right), width and right spacing.
Product Title Styles: Choose the Text color for normal and hover modes.
Product Title Typography: Set a Typography using settings from the dropdown.
Product Price Styles: Choose the price style between Inline and Block and set the color.
Block type also allows setting the Top margin for desktop, tablet and mobile.
Product Price Typography: Set a Typography using settings from the dropdown.
Remove Icon Button: Set the Icon color and background color for normal and hover modes, choose the border type, border radius and padding for desktop, tablet and mobile.
Product Separator: Choose a separator style, color and width.
Cart Buttons
Buttons Type: Choose between Inline and stacked types.
Typography: Set a Typography using settings from the dropdown.
Color: Choose buttons color for normal and hover modes.
Background Color: Choose buttons background color for normal and hover modes.
Border Type: Choose the desired Border Type from the dropdown and set it.
Border Radius: Set buttons border radius.
Buttons Padding: Set buttons padding for desktop, tablet and mobile.
Spacing Top: Set buttons top spacing for desktop, tablet and mobile.
Space Between: Set a space between buttons for desktop, tablet and mobile.
View Cart Button: Set a view cart button color and background color for normal and hover modes and choose the border type.
Checkout Button: Set a checkout button color and background color for normal and hover modes and choose the border type.
Advanced
Set the Advanced options that are applicable to this widget