There are many options to customize the Cart Panel’s appearance. The best place to put the Cart button is on the master page so that it is applied to every page in your shop.
You can pick and choose what you want to display in the Cart by checking and unchecking the boxes at the top.
1 - General
Transition Type: Choose how your Cart opens. The options are
- Scale/Hide | Center
- Full-height | Right
- Sliding | Top-Right
- Move in | Top
Customized Scroll Bar: Choose the size and color.
Top and Bottom Sections Separator: Change the color of the line that separates the top and bottom sections.
Shadow Intensity: Change the intensity of the Cart’s shadow. 1 is 100% shadow opacity. 0 is 0% shadow opacity.
2 - Name, Variation, and Price
Customize the font size, letter-spacing, font color, and font weight. For font weight, you can choose between thin, normal, and bold.
You can change the font by selecting the cart and changing the font through the Text panel.
3 - Image
Specify the size of the product images as well as any rounded corners.
4 - Quantity Box
Customize the width and height of the quantity box.
Choose the font size and add rounded corners.
Signs Thickness: Choose how thick you want the - and + signs to be.
Specify background, border, font, and sign colors.
For signs color, you can choose black, white, or gray.
5 - Subtotal
Subtotal Text: Enter your own text to show up beside the subtotal. Customize the font size, letter-spacing, font color, and weight (thin, normal, bold).
Subtotal Price: Specify the font size, letter-spacing, font color, and font weight (thin, normal, or bold).
6 - Notice
In-Cart Notice: Appears inside the cart. Enter your own text.
Empty-Cart Notice: Appears when the cart is empty. Enter your own text.
Customize the font-size, letter-spacing, font color, and font weight (thin, normal, bold)
7 - Checkout Button
Customize the text that will show up on your checkout button.
Specify the width, height, rounded corners, and border thickness.
Style the background, border, font, font-size, letter-spacing, and font weight (thin, normal, bold) of the checkout button.
On Hover: customize the button background color and font color for the checkout button on hover.
8 - Close Button
Customize the close button size, add rounded corners, change the sign thickness (close button thickness), background color, sign color, and border color.
9 - Additional Tips
To change the fill color of the Cart simply select the cart and change the fill color.
You can also add a stroke and a corner radius.
Change the font by selecting the cart and changing the font through the Text Panel.