How can I display the grand total in the minicart? - Magento2 Planned maintenance scheduled April 23, 2019 at 23:30 UTC (7:30pm US/Eastern) Announcing the arrival of Valued Associate #679: Cesar Manara Unicorn Meta Zoo #1: Why another podcast?Subtotal and Grand TotalTax not added to the base product price in cart and when placing orderHow can I get discount amount and grand total amount in mini cart ? (Magento 1.9)Wrong discount amount showingMagento 1.9.2.2 - Grand Total less than Subtotalbase subtotal including taxIncluding tax in Magento subtotal and shipping on order emailI want to display only tax it wont be include in grand totalHow to show grand total of wishlist item list incluging tax?
What does Turing mean by this statement?
Why is a lens darker than other ones when applying the same settings?
A proverb that is used to imply that you have unexpectedly faced a big problem
How many time has Arya actually used Needle?
Found this skink in my tomato plant bucket. Is he trapped? Or could he leave if he wanted?
Is there hard evidence that the grant peer review system performs significantly better than random?
How much damage would a cupful of neutron star matter do to the Earth?
Is multiple magic items in one inherently imbalanced?
How to ternary Plot3D a function
Can an iPhone 7 be made to function as a NFC Tag?
Flight departed from the gate 5 min before scheduled departure time. Refund options
retrieve food groups from food item list
Printing attributes of selection in ArcPy?
Ore hitori de wa kesshite miru koto no deki nai keshiki; It's a view I could never see on my own
One-one communication
Simple Http Server
What does it mean that physics no longer uses mechanical models to describe phenomena?
How can a team of shapeshifters communicate?
My mentor says to set image to Fine instead of RAW — how is this different from JPG?
How would a mousetrap for use in space work?
Why does electrolysis of aqueous concentrated sodium bromide produce bromine at the anode?
How can I prevent/balance waiting and turtling as a response to cooldown mechanics
RSA find public exponent
What to do with repeated rejections for phd position
How can I display the grand total in the minicart? - Magento2
Planned maintenance scheduled April 23, 2019 at 23:30 UTC (7:30pm US/Eastern)
Announcing the arrival of Valued Associate #679: Cesar Manara
Unicorn Meta Zoo #1: Why another podcast?Subtotal and Grand TotalTax not added to the base product price in cart and when placing orderHow can I get discount amount and grand total amount in mini cart ? (Magento 1.9)Wrong discount amount showingMagento 1.9.2.2 - Grand Total less than Subtotalbase subtotal including taxIncluding tax in Magento subtotal and shipping on order emailI want to display only tax it wont be include in grand totalHow to show grand total of wishlist item list incluging tax?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
I currently have my subtotal tax settings set to 'Display subtotal excluding tax'. This has changed the subtotal in the minicart to display the subtotal excluding tax.
How can I display the grand total of the order including tax in the highlighted area with the settings mentioned above?
magento-2.1 tax mini-cart totals
add a comment |
I currently have my subtotal tax settings set to 'Display subtotal excluding tax'. This has changed the subtotal in the minicart to display the subtotal excluding tax.
How can I display the grand total of the order including tax in the highlighted area with the settings mentioned above?
magento-2.1 tax mini-cart totals
add a comment |
I currently have my subtotal tax settings set to 'Display subtotal excluding tax'. This has changed the subtotal in the minicart to display the subtotal excluding tax.
How can I display the grand total of the order including tax in the highlighted area with the settings mentioned above?
magento-2.1 tax mini-cart totals
I currently have my subtotal tax settings set to 'Display subtotal excluding tax'. This has changed the subtotal in the minicart to display the subtotal excluding tax.
How can I display the grand total of the order including tax in the highlighted area with the settings mentioned above?
magento-2.1 tax mini-cart totals
magento-2.1 tax mini-cart totals
asked Jan 16 '18 at 11:21
Ryan CopelandRyan Copeland
458321
458321
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
Not tested, just an idea
You could extend module-checkout/view/frontend/layout/default.xml & replace subtotal (or create a new) component with your needings
<item name="subtotal.container" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="displayArea" xsi:type="string">subtotalContainer</item>
</item>
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Magento_Checkout/minicart/subtotal</item>
</item>
</item>
</item>
</item>
More info about uiComponents http://devdocs.magento.com/guides/v2.1/ui_comp_guide/concepts/ui_comp_xmldeclaration_concept.html
An alternate, and easier, way if you are not comfortable with UI Components (easy!) would be deleting that component in your layout extend & then just print your wanted value in Magento_Checkout::cart/minicart.phtml template (overwriting the template in your custom theme, of course)
<?php echo $block->getQuote()->getGrandTotal(); ?>
This should work, as MagentoCheckoutBlockCartSidebar (which is the associated block of minicart template) extends MagentoCheckoutBlockCartAbstractCart, which provides getQuote()
method
add a comment |
This may be late, but I would post this for the people who reach here in future.
Let's start with the layout.xml
[scope]/[module]/view/frontend/layout/default.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="MagentoCheckoutBlockOnepage" name="common.checkout.config"
template="[scope]_[module]::checkout/config.phtml" cacheable="false">
</block>
</referenceContainer>
<referenceBlock name="minicart">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="grand-total" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/summary/grand-total</item>
<item name="displayArea" xsi:type="string">totals</item>
<item name="config" xsi:type="array">
<item name="title" xsi:type="string" translate="true">Total Cost with GST</item>
<item name="template" xsi:type="string">Magento_Checkout/cart/totals/grand-total</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
I am not sure if it is a good idea to place cacheable="false" block in a default.xml, Better to try without it and thoroughly test.
[scope]/[module]/view/frontend/templates/checkout/config.phtml
Those who need the explanation, why below two code blocks are needed please check at the end of the post.
<script>
window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;
// Create aliases for customer.js model from customer module
window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
window.customerData = window.checkoutConfig.customerData;
</script>
In [scope]/[module]/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="common.checkout.config" remove="true"/>
</body>
</page>
Finaly let's add them to the mini-cart
app/design/frontend/[package]/[theme]/[scope]_[module]/templates/cart/minicart.phtml
<div id="grand-total" class="grand-total" data-bind="scope:'grand-total'">
<!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
"#grand-total":
"Magento_Ui/js/core/app": <?= /* @escapeNotVerified */ $block->getJsLayout() ?>
</script>
The explanation for adding window.checkoutConfig
When loading vendor/magento/module-checkout/view/frontend/web/js/view/summary/grand-total.js (By Magento_Checkout/js/view/summary/grand-total entry in the default.xml layout file ), It also tries to load the vendor/magento/module-checkout/view/frontend/web/js/model/quote.js (By the 'Magento_Checkout/js/model/quote' in the requireJs define array). However, when loading the quote.js it tries to access certain data in the window.checkoutConfig. This is not available in the pages except checkout control actions. So we have to manually place this on every page with the help of default.xml.
I don't agree with this Magento core implementation as I believe, this should be implemented with the use of customerData with the local storage. You may find more details regarding the issue with this Magento Core approach, in this article by Jisse Reitsma
add a comment |
Your Answer
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "479"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f209621%2fhow-can-i-display-the-grand-total-in-the-minicart-magento2%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
Not tested, just an idea
You could extend module-checkout/view/frontend/layout/default.xml & replace subtotal (or create a new) component with your needings
<item name="subtotal.container" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="displayArea" xsi:type="string">subtotalContainer</item>
</item>
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Magento_Checkout/minicart/subtotal</item>
</item>
</item>
</item>
</item>
More info about uiComponents http://devdocs.magento.com/guides/v2.1/ui_comp_guide/concepts/ui_comp_xmldeclaration_concept.html
An alternate, and easier, way if you are not comfortable with UI Components (easy!) would be deleting that component in your layout extend & then just print your wanted value in Magento_Checkout::cart/minicart.phtml template (overwriting the template in your custom theme, of course)
<?php echo $block->getQuote()->getGrandTotal(); ?>
This should work, as MagentoCheckoutBlockCartSidebar (which is the associated block of minicart template) extends MagentoCheckoutBlockCartAbstractCart, which provides getQuote()
method
add a comment |
Not tested, just an idea
You could extend module-checkout/view/frontend/layout/default.xml & replace subtotal (or create a new) component with your needings
<item name="subtotal.container" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="displayArea" xsi:type="string">subtotalContainer</item>
</item>
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Magento_Checkout/minicart/subtotal</item>
</item>
</item>
</item>
</item>
More info about uiComponents http://devdocs.magento.com/guides/v2.1/ui_comp_guide/concepts/ui_comp_xmldeclaration_concept.html
An alternate, and easier, way if you are not comfortable with UI Components (easy!) would be deleting that component in your layout extend & then just print your wanted value in Magento_Checkout::cart/minicart.phtml template (overwriting the template in your custom theme, of course)
<?php echo $block->getQuote()->getGrandTotal(); ?>
This should work, as MagentoCheckoutBlockCartSidebar (which is the associated block of minicart template) extends MagentoCheckoutBlockCartAbstractCart, which provides getQuote()
method
add a comment |
Not tested, just an idea
You could extend module-checkout/view/frontend/layout/default.xml & replace subtotal (or create a new) component with your needings
<item name="subtotal.container" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="displayArea" xsi:type="string">subtotalContainer</item>
</item>
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Magento_Checkout/minicart/subtotal</item>
</item>
</item>
</item>
</item>
More info about uiComponents http://devdocs.magento.com/guides/v2.1/ui_comp_guide/concepts/ui_comp_xmldeclaration_concept.html
An alternate, and easier, way if you are not comfortable with UI Components (easy!) would be deleting that component in your layout extend & then just print your wanted value in Magento_Checkout::cart/minicart.phtml template (overwriting the template in your custom theme, of course)
<?php echo $block->getQuote()->getGrandTotal(); ?>
This should work, as MagentoCheckoutBlockCartSidebar (which is the associated block of minicart template) extends MagentoCheckoutBlockCartAbstractCart, which provides getQuote()
method
Not tested, just an idea
You could extend module-checkout/view/frontend/layout/default.xml & replace subtotal (or create a new) component with your needings
<item name="subtotal.container" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="displayArea" xsi:type="string">subtotalContainer</item>
</item>
<item name="children" xsi:type="array">
<item name="subtotal" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Magento_Checkout/minicart/subtotal</item>
</item>
</item>
</item>
</item>
More info about uiComponents http://devdocs.magento.com/guides/v2.1/ui_comp_guide/concepts/ui_comp_xmldeclaration_concept.html
An alternate, and easier, way if you are not comfortable with UI Components (easy!) would be deleting that component in your layout extend & then just print your wanted value in Magento_Checkout::cart/minicart.phtml template (overwriting the template in your custom theme, of course)
<?php echo $block->getQuote()->getGrandTotal(); ?>
This should work, as MagentoCheckoutBlockCartSidebar (which is the associated block of minicart template) extends MagentoCheckoutBlockCartAbstractCart, which provides getQuote()
method
answered Jan 16 '18 at 12:47
Raul SanchezRaul Sanchez
2,18931335
2,18931335
add a comment |
add a comment |
This may be late, but I would post this for the people who reach here in future.
Let's start with the layout.xml
[scope]/[module]/view/frontend/layout/default.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="MagentoCheckoutBlockOnepage" name="common.checkout.config"
template="[scope]_[module]::checkout/config.phtml" cacheable="false">
</block>
</referenceContainer>
<referenceBlock name="minicart">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="grand-total" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/summary/grand-total</item>
<item name="displayArea" xsi:type="string">totals</item>
<item name="config" xsi:type="array">
<item name="title" xsi:type="string" translate="true">Total Cost with GST</item>
<item name="template" xsi:type="string">Magento_Checkout/cart/totals/grand-total</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
I am not sure if it is a good idea to place cacheable="false" block in a default.xml, Better to try without it and thoroughly test.
[scope]/[module]/view/frontend/templates/checkout/config.phtml
Those who need the explanation, why below two code blocks are needed please check at the end of the post.
<script>
window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;
// Create aliases for customer.js model from customer module
window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
window.customerData = window.checkoutConfig.customerData;
</script>
In [scope]/[module]/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="common.checkout.config" remove="true"/>
</body>
</page>
Finaly let's add them to the mini-cart
app/design/frontend/[package]/[theme]/[scope]_[module]/templates/cart/minicart.phtml
<div id="grand-total" class="grand-total" data-bind="scope:'grand-total'">
<!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
"#grand-total":
"Magento_Ui/js/core/app": <?= /* @escapeNotVerified */ $block->getJsLayout() ?>
</script>
The explanation for adding window.checkoutConfig
When loading vendor/magento/module-checkout/view/frontend/web/js/view/summary/grand-total.js (By Magento_Checkout/js/view/summary/grand-total entry in the default.xml layout file ), It also tries to load the vendor/magento/module-checkout/view/frontend/web/js/model/quote.js (By the 'Magento_Checkout/js/model/quote' in the requireJs define array). However, when loading the quote.js it tries to access certain data in the window.checkoutConfig. This is not available in the pages except checkout control actions. So we have to manually place this on every page with the help of default.xml.
I don't agree with this Magento core implementation as I believe, this should be implemented with the use of customerData with the local storage. You may find more details regarding the issue with this Magento Core approach, in this article by Jisse Reitsma
add a comment |
This may be late, but I would post this for the people who reach here in future.
Let's start with the layout.xml
[scope]/[module]/view/frontend/layout/default.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="MagentoCheckoutBlockOnepage" name="common.checkout.config"
template="[scope]_[module]::checkout/config.phtml" cacheable="false">
</block>
</referenceContainer>
<referenceBlock name="minicart">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="grand-total" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/summary/grand-total</item>
<item name="displayArea" xsi:type="string">totals</item>
<item name="config" xsi:type="array">
<item name="title" xsi:type="string" translate="true">Total Cost with GST</item>
<item name="template" xsi:type="string">Magento_Checkout/cart/totals/grand-total</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
I am not sure if it is a good idea to place cacheable="false" block in a default.xml, Better to try without it and thoroughly test.
[scope]/[module]/view/frontend/templates/checkout/config.phtml
Those who need the explanation, why below two code blocks are needed please check at the end of the post.
<script>
window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;
// Create aliases for customer.js model from customer module
window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
window.customerData = window.checkoutConfig.customerData;
</script>
In [scope]/[module]/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="common.checkout.config" remove="true"/>
</body>
</page>
Finaly let's add them to the mini-cart
app/design/frontend/[package]/[theme]/[scope]_[module]/templates/cart/minicart.phtml
<div id="grand-total" class="grand-total" data-bind="scope:'grand-total'">
<!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
"#grand-total":
"Magento_Ui/js/core/app": <?= /* @escapeNotVerified */ $block->getJsLayout() ?>
</script>
The explanation for adding window.checkoutConfig
When loading vendor/magento/module-checkout/view/frontend/web/js/view/summary/grand-total.js (By Magento_Checkout/js/view/summary/grand-total entry in the default.xml layout file ), It also tries to load the vendor/magento/module-checkout/view/frontend/web/js/model/quote.js (By the 'Magento_Checkout/js/model/quote' in the requireJs define array). However, when loading the quote.js it tries to access certain data in the window.checkoutConfig. This is not available in the pages except checkout control actions. So we have to manually place this on every page with the help of default.xml.
I don't agree with this Magento core implementation as I believe, this should be implemented with the use of customerData with the local storage. You may find more details regarding the issue with this Magento Core approach, in this article by Jisse Reitsma
add a comment |
This may be late, but I would post this for the people who reach here in future.
Let's start with the layout.xml
[scope]/[module]/view/frontend/layout/default.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="MagentoCheckoutBlockOnepage" name="common.checkout.config"
template="[scope]_[module]::checkout/config.phtml" cacheable="false">
</block>
</referenceContainer>
<referenceBlock name="minicart">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="grand-total" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/summary/grand-total</item>
<item name="displayArea" xsi:type="string">totals</item>
<item name="config" xsi:type="array">
<item name="title" xsi:type="string" translate="true">Total Cost with GST</item>
<item name="template" xsi:type="string">Magento_Checkout/cart/totals/grand-total</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
I am not sure if it is a good idea to place cacheable="false" block in a default.xml, Better to try without it and thoroughly test.
[scope]/[module]/view/frontend/templates/checkout/config.phtml
Those who need the explanation, why below two code blocks are needed please check at the end of the post.
<script>
window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;
// Create aliases for customer.js model from customer module
window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
window.customerData = window.checkoutConfig.customerData;
</script>
In [scope]/[module]/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="common.checkout.config" remove="true"/>
</body>
</page>
Finaly let's add them to the mini-cart
app/design/frontend/[package]/[theme]/[scope]_[module]/templates/cart/minicart.phtml
<div id="grand-total" class="grand-total" data-bind="scope:'grand-total'">
<!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
"#grand-total":
"Magento_Ui/js/core/app": <?= /* @escapeNotVerified */ $block->getJsLayout() ?>
</script>
The explanation for adding window.checkoutConfig
When loading vendor/magento/module-checkout/view/frontend/web/js/view/summary/grand-total.js (By Magento_Checkout/js/view/summary/grand-total entry in the default.xml layout file ), It also tries to load the vendor/magento/module-checkout/view/frontend/web/js/model/quote.js (By the 'Magento_Checkout/js/model/quote' in the requireJs define array). However, when loading the quote.js it tries to access certain data in the window.checkoutConfig. This is not available in the pages except checkout control actions. So we have to manually place this on every page with the help of default.xml.
I don't agree with this Magento core implementation as I believe, this should be implemented with the use of customerData with the local storage. You may find more details regarding the issue with this Magento Core approach, in this article by Jisse Reitsma
This may be late, but I would post this for the people who reach here in future.
Let's start with the layout.xml
[scope]/[module]/view/frontend/layout/default.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="MagentoCheckoutBlockOnepage" name="common.checkout.config"
template="[scope]_[module]::checkout/config.phtml" cacheable="false">
</block>
</referenceContainer>
<referenceBlock name="minicart">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="grand-total" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/summary/grand-total</item>
<item name="displayArea" xsi:type="string">totals</item>
<item name="config" xsi:type="array">
<item name="title" xsi:type="string" translate="true">Total Cost with GST</item>
<item name="template" xsi:type="string">Magento_Checkout/cart/totals/grand-total</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
I am not sure if it is a good idea to place cacheable="false" block in a default.xml, Better to try without it and thoroughly test.
[scope]/[module]/view/frontend/templates/checkout/config.phtml
Those who need the explanation, why below two code blocks are needed please check at the end of the post.
<script>
window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;
// Create aliases for customer.js model from customer module
window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
window.customerData = window.checkoutConfig.customerData;
</script>
In [scope]/[module]/view/frontend/layout/checkout_index_index.xml
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="common.checkout.config" remove="true"/>
</body>
</page>
Finaly let's add them to the mini-cart
app/design/frontend/[package]/[theme]/[scope]_[module]/templates/cart/minicart.phtml
<div id="grand-total" class="grand-total" data-bind="scope:'grand-total'">
<!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
"#grand-total":
"Magento_Ui/js/core/app": <?= /* @escapeNotVerified */ $block->getJsLayout() ?>
</script>
The explanation for adding window.checkoutConfig
When loading vendor/magento/module-checkout/view/frontend/web/js/view/summary/grand-total.js (By Magento_Checkout/js/view/summary/grand-total entry in the default.xml layout file ), It also tries to load the vendor/magento/module-checkout/view/frontend/web/js/model/quote.js (By the 'Magento_Checkout/js/model/quote' in the requireJs define array). However, when loading the quote.js it tries to access certain data in the window.checkoutConfig. This is not available in the pages except checkout control actions. So we have to manually place this on every page with the help of default.xml.
I don't agree with this Magento core implementation as I believe, this should be implemented with the use of customerData with the local storage. You may find more details regarding the issue with this Magento Core approach, in this article by Jisse Reitsma
answered 9 mins ago
MudithaEMudithaE
1214
1214
add a comment |
add a comment |
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f209621%2fhow-can-i-display-the-grand-total-in-the-minicart-magento2%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown