{"id":2167,"date":"2024-11-15T18:28:51","date_gmt":"2024-11-15T16:28:51","guid":{"rendered":"https:\/\/plumrocket.com\/learn\/?p=2167"},"modified":"2025-04-03T15:09:50","modified_gmt":"2025-04-03T12:09:50","slug":"how-to-update-reload-magento-2-mini-cart-programmatically","status":"publish","type":"post","link":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart","title":{"rendered":"How to Update\/Reload Magento 2 Mini Cart Programmatically"},"content":{"rendered":"\n
\"How<\/figure>\n\n\n\n

When developing a custom solution, whether it is a theme or a module, developers need to implement logic that adds a new product or modifies the quantity of the product in the cart. It may seem a straightforward task, but developers often face an issue where changes in the mini cart aren’t reflected.<\/p>\n\n\n\n

This article will explore the most frequent reason why the updated mini cart data may not be visible on the frontend and provide step-by-step instructions on how to reload Magento 2 Mini Cart programmatically.<\/p>\n\n\n\n

\n

Struggling to get your Magento 2 mini cart to update correctly? Our expert Magento developers can help! <\/p>\n\n\n\n

\n
Get Expert Magento Help<\/a><\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n

Common Pitfalls in Setting Up Magento 2 Mini Cart Reload<\/h2>\n\n\n\n

The most frequent reason why developers may experience issues with programmatically reloading the Magento 2 mini cart usually lies within the Magento caching system, specifically in its private content rendering.<\/p>\n\n\n\n

In Magento, private content refers to data that is specific to individual users. This includes things like the contents of the mini carts, wishlist items, account-specific notifications, etc.<\/p>\n\n\n\n

The thing is that Magento caches information about the mini cart on the client side rather than in the full-page cache. So when the cart is updated from the backend, the frontend is not aware that the mini cart data has changed.<\/p>\n\n\n\n

Generally, Magento 2 provides tools to invalidate private content – they inform the caching system that the private content data has been changed and needs to be refreshed or reloaded for the user session to reflect the latest updates.<\/p>\n\n\n\n

Let\u2019s explore in the next section how to update the Magento 2 mini cart programmatically, considering the private content rendering issue.<\/p>\n\n\n\n

How to Update\/Reload Mini Cart Programmatically<\/h2>\n\n\n\n

There are two ways to update the mini cart programmatically in Magento 2.<\/p>\n\n\n\n

Method 1: Using sections.xml File<\/h3>\n\n\n\n

The Sections.xml<\/code> file helps Magento identify actions that should trigger cache updates on the storefront side. The file must be located in the custom module within the etc\/frontend<\/code> folder and contain a structure similar to the following:<\/p>\n\n\n\n

<\/div>
<?xml version=\"1.0\"?>\n<config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:module:Magento_Customer:etc\/sections.xsd\">\n    <action name=\"moduleFrontName\/actionFolder\/action\">\n        <section name=\"cart\"\/>\n    <\/action>\n<\/config>\n<\/code><\/pre><\/div>\n\n\n\n
In the action<\/code> tag, replace the name<\/code> attribute value with your module’s values.<\/p>\n\n\n\n
\n
Important Information:<\/p>\n\n\n\n
This method works only for actions using the HTTP POST or PUT methods.<\/p>\n<\/div><\/div>\n\n\n\n
Method 2: Invalidate Cache With Custom JS<\/h3>\n\n\n\n
For this method, you need to add a new JavaScript file to the page via a custom module or theme. This will ensure that the mini cart updates when navigating to that page.<\/p>\n\n\n\n
The content of the JavaScript file should have a structure similar to the following.<\/p>\n\n\n\n
<\/div>
define(['Magento_Customer\/js\/customer-data'], function(customerData) {\n    let sections = ['cart'];\n    customerData.invalidate(sections);\n    customerData.reload(sections, true);\n})\n<\/code><\/pre><\/div>\n\n\n\n
This file starts the cache invalidation process for the mini cart, reloading the latest data from the backend.<\/p>\n\n\n\n
Conclusion<\/h2>\n\n\n\n
The need for the mini cart update arises due to the Magento 2 caching system, which enhances site performance through client-side caching. To reload\/update mini cart programmatically, Magento 2 provides two main tools: the sections.xml file and the custom js file that directly invalidates customerData and reflects changes on the frontend.<\/p>\n\n\n\n
If you need any help implementing these methods, feel free to contact us<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"
When developing a custom solution, whether it is a theme or a module, developers need to implement logic that adds a new product or modifies the quantity of the product in the cart. It may seem a straightforward task, but developers often face an issue where changes in the mini cart aren’t reflected.<\/p>\n
This article will explore the most frequent reason why the updated mini cart data may not be visible on the frontend and provide step-by-step instructions on how to reload Magento 2 Mini Cart programmatically.<\/p>\n","protected":false},"author":11,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_mi_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0},"categories":[121,123],"tags":[],"yoast_head":"\nHow to Update\/Reload Magento 2 Mini Cart Programmatically<\/title>\n<meta name=\"description\" content=\"Learn how to reload\/update the Magento 2 mini cart programmatically. This guide covers two effective methods for seamless storefront caching.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Update\/Reload Magento 2 Mini Cart Programmatically\" \/>\n<meta property=\"og:description\" content=\"Learn how to reload\/update the Magento 2 mini cart programmatically. This guide covers two effective methods for seamless storefront caching.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart\" \/>\n<meta property=\"og:site_name\" content=\"Magento Tutorials for Beginners & Professionals\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-15T16:28:51+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-03T12:09:50+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/posts\/2167"}],"collection":[{"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/comments?post=2167"}],"version-history":[{"count":10,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/posts\/2167\/revisions"}],"predecessor-version":[{"id":2378,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/posts\/2167\/revisions\/2378"}],"wp:attachment":[{"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/media?parent=2167"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/categories?post=2167"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/tags?post=2167"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}