Autoscroll down on open cart widget

Hello,

I have a webshop where customers usually makes big carts with so much items. I have configured the “Display Widget” action after add to cart, and when the cart have many items (like 50 for example) and the customer adds to cart a new item, he needs to scroll so much to find the last item added,

Do you know if there is any Custom JS code snippet to autoscroll down on cart widget open?

Many thanks in advance,

Hello,

Thank you very much for choosing our theme and for contacting us.

This is the way the Woocommerce widget works and our theme does not influence that. You can disable the shopping cart as a sidebar and redirect the customer just to the shopping cart page. Unfortunately, we do not have any solution for that.

Best Regards

I’ve seen in your functions.js that when you add to cart it triggers the click of the “.cart-widget-opener a” element. You can’t add any action to this .cart-widget-opener a to scroll .shopping-cart-widget-body?

I tested this and doesn’t works:

jQuery(‘.cart-widget-opener’).on(‘click’, ‘a’, function(){
$(‘html,body’).animate({scrollTop: shopping-cart-widget-body.offset().bottom});
});

Thanks in advance,

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

.widget_shopping_cart .product_list_widget {
    display: flex;
    flex-direction: column-reverse;
}
.widget_shopping_cart .product_list_widget>li:last-child {
    border-bottom: 1px solid rgba(129,129,129,.2);
}
.widget_shopping_cart .product_list_widget>li:first-child {
    border-bottom: none;
}

New products would go to the top.

Best Regards

It’s better solution that I proposed, reverse the order of the items by css instead of auto-scroll.

Many thanks!

You are welcome! If you have any questions please feel free to contact us.

Best Regards

On mini cart the CSS works well, but to have coherence, I need to reverse too the normal cart order of the items by CSS. Do you know how to do it? Thanks in advance.

Hello,

HTML structure does not allow solving it by custom CSS. Such modification requires complicated Woocommerce code customization which is not covered by our support.

A shopping cart is created in the table and such CSS would work.

Best Regards

[Author]

Posts