{"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<figure class=\"wp-block-image size-full disable_zoom\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png\" alt=\"How to Update\/Reload Magento 2 Mini Cart Programmatically\" class=\"wp-image-2170\" srcset=\"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png 800w, https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1-300x113.png 300w, https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1-768x288.png 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">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&#8217;t reflected.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">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<div class=\"wp-block-cover has-background-dim\" style=\"background-color:#f5f5f5;min-height:100px;aspect-ratio:unset;\"><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<p class=\"has-text-align-center has-dark-gray-color has-text-color wp-block-paragraph\">Struggling to get your Magento 2 mini cart to update correctly? Our expert Magento developers can help! <\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-background\" href=\"\/magento-services\" style=\"border-radius:32px;background-color:#4f9e6c\" target=\"_blank\" rel=\"noreferrer noopener\">Get Expert Magento Help<\/a><\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Common Pitfalls in Setting Up Magento 2 Mini Cart Reload<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">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<p class=\"wp-block-paragraph\">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<p class=\"wp-block-paragraph\">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<p class=\"wp-block-paragraph\">Generally, Magento 2 provides tools to invalidate private content &#8211; 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<p class=\"wp-block-paragraph\">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<h2 class=\"wp-block-heading\">How to Update\/Reload Mini Cart Programmatically<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">There are two ways to update the mini cart programmatically in Magento 2.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Method 1: Using sections.xml File<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The <code class=\"\" data-line=\"\">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 <code class=\"\" data-line=\"\">etc\/frontend<\/code> folder and contain a structure similar to the following:<\/p>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-php\" data-line=\"\">&lt;?xml version=&quot;1.0&quot;?&gt;\n&lt;config xmlns:xsi=&quot;http:\/\/www.w3.org\/2001\/XMLSchema-instance&quot; xsi:noNamespaceSchemaLocation=&quot;urn:magento:module:Magento_Customer:etc\/sections.xsd&quot;&gt;\n    &lt;action name=&quot;moduleFrontName\/actionFolder\/action&quot;&gt;\n        &lt;section name=&quot;cart&quot;\/&gt;\n    &lt;\/action&gt;\n&lt;\/config&gt;\n<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">In the <code class=\"\" data-line=\"\">action<\/code> tag, replace the <code class=\"\" data-line=\"\">name<\/code> attribute value with your module&#8217;s values.<\/p>\n\n\n\n<div class=\"wp-block-group pr-notice pr-notice-warning\"><div class=\"wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow\">\n<p class=\"pr-notice-title wp-block-paragraph\">Important Information:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This method works only for actions using the HTTP POST or PUT methods.<\/p>\n<\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Method 2: Invalidate Cache With Custom JS<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">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<p class=\"wp-block-paragraph\">The content of the JavaScript file should have a structure similar to the following.<\/p>\n\n\n\n<div class=\"wp-block-prismatic-blocks\"><div><\/div><pre><code class=\"language-php\" data-line=\"\">define([&#039;Magento_Customer\/js\/customer-data&#039;], function(customerData) {\n    let sections = [&#039;cart&#039;];\n    customerData.invalidate(sections);\n    customerData.reload(sections, true);\n})\n<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">This file starts the cache invalidation process for the mini cart, reloading the latest data from the backend.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">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<p class=\"wp-block-paragraph\">If you need any help implementing these methods, feel free to <a href=\"\/contacts\">contact us<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>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&#8217;t reflected.<\/p>\n<p>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":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[121,123],"tags":[],"class_list":["post-2167","post","type-post","status-publish","format-standard","hentry","category-magento-config","category-magento-frontend-dev-guide","entry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How 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 &amp; 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=\"author\" content=\"Vladyslav Harkavenko\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Vladyslav Harkavenko\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Update\/Reload Magento 2 Mini Cart Programmatically","description":"Learn how to reload\/update the Magento 2 mini cart programmatically. This guide covers two effective methods for seamless storefront caching.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart","og_locale":"en_US","og_type":"article","og_title":"How to Update\/Reload Magento 2 Mini Cart Programmatically","og_description":"Learn how to reload\/update the Magento 2 mini cart programmatically. This guide covers two effective methods for seamless storefront caching.","og_url":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart","og_site_name":"Magento Tutorials for Beginners &amp; Professionals","article_published_time":"2024-11-15T16:28:51+00:00","article_modified_time":"2025-04-03T12:09:50+00:00","og_image":[{"url":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png","type":"","width":"","height":""}],"author":"Vladyslav Harkavenko","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Vladyslav Harkavenko","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#article","isPartOf":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart"},"author":{"name":"Vladyslav Harkavenko","@id":"https:\/\/plumrocket.com\/learn\/#\/schema\/person\/336e826b8da38d4fe265ff4c3f4b1022"},"headline":"How to Update\/Reload Magento 2 Mini Cart Programmatically","datePublished":"2024-11-15T16:28:51+00:00","dateModified":"2025-04-03T12:09:50+00:00","mainEntityOfPage":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart"},"wordCount":504,"commentCount":0,"image":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#primaryimage"},"thumbnailUrl":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png","articleSection":["Magento Configuration","Magento Frontend Development"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#respond"]}]},{"@type":"WebPage","@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart","url":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart","name":"How to Update\/Reload Magento 2 Mini Cart Programmatically","isPartOf":{"@id":"https:\/\/plumrocket.com\/learn\/#website"},"primaryImageOfPage":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#primaryimage"},"image":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#primaryimage"},"thumbnailUrl":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png","datePublished":"2024-11-15T16:28:51+00:00","dateModified":"2025-04-03T12:09:50+00:00","author":{"@id":"https:\/\/plumrocket.com\/learn\/#\/schema\/person\/336e826b8da38d4fe265ff4c3f4b1022"},"description":"Learn how to reload\/update the Magento 2 mini cart programmatically. This guide covers two effective methods for seamless storefront caching.","breadcrumb":{"@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#primaryimage","url":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png","contentUrl":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/11\/update-reload-mini-cart-programmatically-1.png","width":800,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/plumrocket.com\/learn\/magento-2-reload-mini-cart#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Learn","item":"https:\/\/plumrocket.com\/learn"},{"@type":"ListItem","position":2,"name":"How to Update\/Reload Magento 2 Mini Cart Programmatically"}]},{"@type":"WebSite","@id":"https:\/\/plumrocket.com\/learn\/#website","url":"https:\/\/plumrocket.com\/learn\/","name":"Magento Tutorials for Beginners &amp; Professionals","description":"Plumrocket Inc","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/plumrocket.com\/learn\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/plumrocket.com\/learn\/#\/schema\/person\/336e826b8da38d4fe265ff4c3f4b1022","name":"Vladyslav Harkavenko","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/10\/avatar_user_11_1730304398-96x96.png","url":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/10\/avatar_user_11_1730304398-96x96.png","contentUrl":"https:\/\/plumrocket.com\/learn\/wp-content\/uploads\/2024\/10\/avatar_user_11_1730304398-96x96.png","caption":"Vladyslav Harkavenko"},"description":"PHP developer with a passion for discovering new horizons in web development. Enjoys exploring how systems work behind the scenes and understanding their core principles.","url":"https:\/\/plumrocket.com\/learn\/author\/vladyslav-harkavenko"}]}},"_links":{"self":[{"href":"https:\/\/plumrocket.com\/learn\/wp-json\/wp\/v2\/posts\/2167","targetHints":{"allow":["GET"]}}],"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}]}}