Magento – Magento 2 : Add to Cart Success Message in a Popup

addtocartmagento-2.1popupsuccess-message

How can I show Add to Cart success message ("You added 'Product name' to your shopping cart.") in a popup in Magento 2?

Best Answer

Copy catalog-add-to-cart.js from core '\module-catalog\view\frontend\web\js/catalog-add-to-cart.js and place into your theme folder \Package/theme/Magento_Catalog/web/js/catalog-add-to-cart.js

Now find ajaxSubmit function and add below code after self.enableAddToCartButton(form);

var popup = $('<div class="add-to-cart-dialog"/>').html($('.page-title span').text() + '<span> has been added to cart.</span>').modal({ //get product name from product view page only
                    modalClass: 'add-to-cart-success-popup'
                });
                popup.modal('openModal');

Reference for more modal options: https://devdocs.magento.com/guides/v2.4/javascript-dev-guide/widgets/widget_modal.html