Magento 2.1 – How to Add Scrollbar to Minicart Dropdown Content

magento-2.1mini-cart

Currently, when 5+ products are added to Cart and a user clicks on the minicart icon, so that the dropdown is initialized – the dropdown contents go beyond screen fold, effectively hiding a portion of itself.

The minicart icon is fixed on a sticky top menu, so that when the screen is scrolled down, the hidden minicart dropdown contents stay beyond the screen fold. It's ugly and very user unfriendly.

I wonder what would be the best way to add scrollbar to the minicart dropdown and make the minicart dropdown content scrollable after, say, 5 items have been added to it? Or, make the contents scrollable after a certain pixel length of the dropdown is exceeded? What would the JS code be for achieving this?

How can I make the minicart dropdown content scrollable?

Magento 2.1 scrollable minicart

I have a Magento 2.1.9 instance. All teaching is welcome! Thanks!

Best Answer

There is a default configuration for that under

System -> Configuration -> Checkout -> Shopping Cart Sidebar

and then the option Number of Items to Display Scrollbar

Related Topic