For more details see the Ajax Shopping Cart for Magento 2 extension page.
Magento 2 AJAX add to cart extension provides a comfortable shopping experience. Customers can easily select configurable options and edit the items in the pop up without wasting time on page reloads.
To configure the module, go to Admin Panel → Stores → Configuration → Amasty Extensions → Ajax Shopping Cart
Enable or disable the extension in Enable Ajax Shopping Cart.
Dialog Close Delay (in seconds): In this field, you can set a timer for Continue button. After a set time expires, a dialog box disappears.
Use Ajax Shopping Cart on Product View Pages: You can choose whether to use AJAX Shopping Cart on product view page or not.
Continue Button Action on Product View Pages: Select whether Continue button on product view page should link to the category page or remain on the product page.
Custom Options Display Mode: Customers can select configurable products and custom options right on the category page. If you use many custom options and would like to display only required ones on category pages, please choose Only Required Options. Otherwise, you can select All Custom Options.
Enable flying image effect: With this setting, you can activate and deactivate nice looking visual effect.
Dialog Box align: Choose, where to locate the cart dialog box - Center, Top, Top left, Top right, Left, Right.
It is possible to select what product information you would like to display in the cart dialog window.
Display Product Image in Dialog: Enable or disable a product image in a dialog box.
Image to Show for Configurable Products: Select whether to display Parent Configurable Product Image or Child Simple Product Image.
Display Total Count of Products in Cart: You can show the number of products in cart.
Display Total Amount in Cart: Display a current cart subtotal to your customers.
Display Go to Checkout Button: To make it easier and to hasten a shopping process, display a button, that leads to checkout.
Display the Product Qty Added to the Cart on the Product Listing: Enable the option to highlight the products that have already been added to the shopping cart. With mouse hover over the product, the number of items added to the cart appears.
To display related products or cross-sells in the cart dialog box, select the necessary option.
Customize visual style of a dialog box.
This is how AJAX shopping cart window looks on the frontend.
When there are no options available to select on the catalog page itself (e.g. Home Page), customers can specify the product options (color, size, quantity) directly in the confirmation dialog (pop-up) without going to the product details page.
When a customer adds a product to the cart without specifying mandatory options (e.g. size, colour, etc.), the AJAX pop-up will be displayed. The customer will be able to choose the required options right in this pop-up.
When adding products to cart, customers will see the item they are adding to cart and also brief cart overview – the number of items in the cart and current subtotal.
This is how the flying image visual effect looks like. It appears when a customer adds a product to the shopping cart.
You can add related products block in the cart dialog. Customers will see it when they add a product to the cart.