To access the Shopping cart popup (panel) please access Customizer > Header > Shopping Cart. Here you can customize both the Cart icon from the header and the panel and its contents.
Please know that the Cart button settings might be overridden by the Cart element from the header eg: https://d.pr/i/exPfWK .
Frequently asked questions:
How to disable the cart panel and link directly to the Cart page.
Simply access Customizer > Header > Shopping cart and turn on the “Disable cart panel ” option eg: https://d.pr/i/eyebL4 .
How to prevent opening the cart panel when a product is added to cart.
Please access Customizer > WooCommerce > Product page – Components and around the Add to cart options locate the “After “Added To Cart” Behaviour” option eg: https://d.pr/i/s1jVRt .
You will be able to change the behaviour of the “Added to cart” functionality to:
- Open the cart panel when product was added
- Redirect to checkout page
- Open a popup with products carousel eg: https://d.pr/i/GhB4yl .
- Do nothing.
If you want to redirect to the cart page, simply disable the Cart panel.
How to enable a list of recently viewed products
Access Customizer > Header > Shopping cart and turn on the “Recently viewed products ” option eg: https://d.pr/i/f35Y6X .
Display a global section inside the panel when there are not products inside it
When the cart is empty, you can pretty much show any content you want through a Generic Global section built with Elementor eg: https://d.pr/i/wSHSD1 .
To select it from a list please access Customizer > Header > Shopping Cart and select it from the “Empty Cart Content” list eg: https://d.pr/i/2rTOBr .
Show/hide quantity controls for the products inside the cart
You can enable quantity controls inside the cart panel eg: https://d.pr/i/nAL50y .
To do so please access Customizer > Header > Shopping cart and turn on the “Show quantity controls ” option eg: https://d.pr/i/6fFkM7 .
Show a “free shipping” progress bar
Incentivise customers to buy more products in order to get no cost for shipping eg: https://d.pr/i/1UDkZc .
To enable please head over to Customizer > Header > Shopping cart and enable the Show Free Shipping bar option eg: https://d.pr/i/NflYcP . If the option doesn’t show up, please make sure “Mini-Cart Free-Shipping Bar” is active in Rey > Modules manager.
You can also add it into the Cart page or change the text inside. To show the remaining amount difference, please use the {{diff}} variable.
Note: the bar might not show up if there’s no minimum amount set in the options, because it would fallback on WooCommerce’s shipping session data which in some cases first need to have an address added into the Cart (shipping calculator) or Checkout page.
Show or hide the coupon code form inside the panel
Offer your customers the ability to add coupon codes right inside the cart panel instead of the cart page or checkout page eg: https://d.pr/i/2jFUfG .
Access Customizer > Header > Shopping cart and turn on the “Coupon Code form” option eg: https://d.pr/i/ry9rAx .
Display a carousel of cross-sells products
Showcase more related products to your customers by displaying a carousel of cross-sells products either on desktop or exclusively mobiles, eg: https://d.pr/i/aCSsMl .
Please head over to Customizer > Header > Shopping cart and enable the Carousel option eg: https://d.pr/i/PH1VdR .
Please make sure you link Cross-sell products inside each product item eg: https://d.pr/i/x42jD5 .
Display a side popover with cross-sells products
For an even more impactful display of related products, you can also disable a popup of products eg: https://d.pr/i/LGSnwO .
To enable, please head over to Customizer > Header > Shopping cart and enable the “Side Bubble” option eg: https://d.pr/i/DyMdBn .
Please make sure you link Cross-sell products inside each product item eg: https://d.pr/i/x42jD5 .