30

I want to get rid of the "Estimate Shipping costs and Tax" block in the cart. The devdocs tell Disabling a component is the way to go, so I tried the following:

<body>
    <referenceBlock name="checkout.cart.shipping">
        <arguments>
            <argument name="jsLayout" xsi:type="array">
                <item name="components" xsi:type="array">
                    <item name="block-summary" xsi:type="array">

                        <!-- My custom part: -->
                        <item name="config" xsi:type="array">
                            <item name="componentDisabled" xsi:type="boolean">true</item>
                        </item>

                    </item>
                </item>
            </argument>
        </arguments>
    </referenceBlock>
</body>

No effect. Also tried:

<referenceBlock name="checkout.cart.shipping" remove="true"/>

This way, my totals block is totally empty.

Does anyone have suggestions?

6 Answers 6

77

I think you messed up some closing / opening tags and amount of them this code works:

<referenceBlock name="checkout.cart.shipping">
    <arguments>
        <argument name="jsLayout" xsi:type="array">
            <item name="components" xsi:type="array">
                <item name="block-summary" xsi:type="array">

                    <!-- My custom part: -->
                    <item name="config" xsi:type="array">
                        <item name="componentDisabled" xsi:type="boolean">true</item>
                    </item>

                </item>
            </item>
        </argument>
    </arguments>
</referenceBlock>

To remove the heading as well, override the template checkout/cart/shipping.phtml and comment/remove the following:

<div class="title" data-role="title">
    <strong id="block-shipping-heading" role="heading" aria-level="2">
        <?php /* @escapeNotVerified */ echo $block->getQuote()->isVirtual() ? __('Estimate Tax') : __('Estimate Shipping and Tax') ?>
    </strong>
</div>
9
  • Indeed, I kind of messed up the double <arguments> nodes. The heading still shows up though, the contents of the dropdown are empty now.. Any suggestions to completely remove it? Commented Apr 29, 2016 at 9:45
  • The heading is specified in the cart shipping template: /vendor/magento/module-checkout/view/frontend/templates/cart/shipping.phtml You can move that into your own template and remove the text from there.
    – Corefix
    Commented Apr 29, 2016 at 10:25
  • 1
    @TimondeGroot You can just only remove the title part from the template file, without create the layout xml file. In this way you can preserve the shipping calculation in the summary block, but hide the "Estimate Shipping costs and Tax" form.
    – Andrea
    Commented Aug 13, 2016 at 16:25
  • 2
    The funny thing is that it does not remove the HTML. There is just a "display:none" added. The real proper solution is to rewrite the shipping-estimation.html in Magento_Checkout/js , and even better, rewrite shipping-estimation.js , to remove all that not useful used CPU time. Commented Aug 29, 2017 at 14:37
  • 2
    Even if you remove this block, it will still show order subtotal with shipping price included Commented Mar 19, 2018 at 11:54
9

I also needed to get rid of the "Estimate Shipping costs and Tax" because of a conflict with a payment module.

If your only objective is to not show the block, why not use CSS? This worked for me:

.cart-container .cart-summary #block-shipping {
    display: none;
}

(Version: Magento 2.2.1)

Edit: I tested the above on 2.3.3 and it also removed the carts sub-total and totals. The below CSS will hide just the estimate shipping and tax. For Version 2.3.3:

.checkout-cart-index #block-shipping { display: none; }

3
  • Where to wite this css ??
    – Manish
    Commented Jun 15, 2018 at 7:59
  • The best way is to use a custom CSS-file that overrides the css-code but doesn't require you to change the original code. There are many guides out there on how to do that. Commented Jun 16, 2018 at 8:38
  • 3
    The best and optimal solution would be the layout way. If you apply a display:none the block still will be loading the js (using resources) Commented Aug 3, 2018 at 22:32
3

You can just add the following to checkout_cart_index.xml (in your custom theme, not core of course)

<referenceBlock name="checkout.cart.shipping" display="false"/>
2
2

Wanted to share my solution as I felt the other answers weren't very clear.

Magento ver. 2.3.4-p2

I don't want to just hide it (CSS trick above would suffice if I wanted to) but rather remove it to reduce resources on the browser and server.

I overrode the Magento_Checkout::view/shipping.phtml file in a module and removed the 2 blocks of code that render this section.

Here are the 2 blocks of code that need to be removed from view/shipping.phtml

Heading

    <div class="title" data-role="title">
        <strong id="block-shipping-heading" role="heading" aria-level="2">
            <?= $block->getQuote()->isVirtual()
                ? $block->escapeHtml(__('Estimate Tax'))
                : $block->escapeHtml(__('Estimate Shipping and Tax'))
            ?>
        </strong>
    </div>

Content

<!-- ko template: getTemplate() --><!-- /ko -->

This is the full solution:

Override the template via a modules layout xml file (could also be done via your theme if wanted):

app/code/Your/Module/view/frontend/layout/checkout_cart_index.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.cart.shipping">
            <action method="setTemplate">
                <argument name="template" xsi:type="string">Your_Module::cart/shipping.phtml</argument>
            </action>
        </referenceBlock>
    </body>
</page>

Then add the modified template file: app/code/Your/Module/view/frontend/templates/cart/shipping.phtml

<?php /** @var $block \Magento\Checkout\Block\Cart\Shipping */ ?>

<div id="block-shipping"
     class="block shipping"
     data-mage-init='{"collapsible":{"openedState": "active", "saveState": true}}'
>
    <div id="block-summary"
         data-bind="scope:'block-summary'"
         class="content"
         data-role="content"
         aria-labelledby="block-shipping-heading"
    >
        <script type="text/x-magento-init">
            {
                "#block-summary": {
                    "Magento_Ui/js/core/app": <?= /* @noEscape */ $block->getJsLayout() ?>
                }
            }
        </script>
        <script>
            window.checkoutConfig = <?= /* @noEscape */ $block->getSerializedCheckoutConfig() ?>;
            window.customerData = window.checkoutConfig.customerData;
            window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
            require([
                'mage/url',
                'Magento_Ui/js/block-loader'
            ], function(url, blockLoader) {
                blockLoader(
                    "<?= $block->escapeJs($block->escapeUrl($block->getViewFileUrl('images/loader-1.gif'))) ?>"
                );
                return url.setBaseUrl('<?= $block->escapeJs($block->escapeUrl($block->getBaseUrl())) ?>');
            })
        </script>
 </div>
</div>

1
  • thanks for sharing this, as well as providing the walk through, as the file in question has been updated, but removing the block of code from the new file still gives the desired effect. this should be the answer in 2024
    – OB7DEV
    Commented Feb 6 at 22:38
1

To override using your custom theme File: app/design/frontend/Local/custom_theme/Magento_Checkout/layout/checkout_cart_index.xml

Content:

    <?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.cart.shipping" remove="true"/>
    </body>
</page>
1

Simply hiding it with CSS was all I needed, I used:

.cart-container .cart-summary #block-shipping .title, 
.cart-container .cart-summary #block-shipping #shipping-zip-form{
display:none;
}

Hides the title and the estimation form.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.