Remove Shipping Estimate Block From Cart Summary

Question

I am having trouble removing the block-shipping from the cart summary in Magento2. This block allows users to obtain a shipping estimate on the cart page. The rest of the summary contents should remain so I don't want to remove the entire block.

The block is created inside the following layout file:

vendor/magento/module-checkout/view/frontend/layout/checkout_cart_index.xml

Layout for the cart summary block is below:

<block class="Magento\Checkout\Block\Cart\Shipping" name="checkout.cart.shipping" as="shipping" template="cart/shipping.phtml" after="checkout.cart.summary.title">
<arguments>
    <argument name="jsLayout" xsi:type="array">
        <item name="types" xsi:type="array">
            <item name="form.input" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                <item name="config" xsi:type="array">
                    <item name="provider" xsi:type="string">checkoutProvider</item>
                    <item name="deps" xsi:type="array">
                        <item name="0" xsi:type="string">checkoutProvider</item>
                    </item>
                    <item name="template" xsi:type="string">ui/form/field</item>
                    <item name="elementTmpl" xsi:type="string">ui/form/element/input</item>
                </item>
            </item>
        </item>
        <item name="components" xsi:type="array">
            <item name="summary-block-config" xsi:type="array">
                <item name="component" xsi:type="string">uiComponent</item>
                <item name="children" xsi:type="array">
                    <item name="shipping-rates-validation" xsi:type="array">
                        <item name="children" xsi:type="array">
                            <!--Step configuration components-->
                        </item>
                    </item>
                </item>
            </item>
            <item name="block-summary" xsi:type="array">
                <item name="component" xsi:type="string">uiComponent</item>
                <item name="deps" xsi:type="array">
                    <item name="0" xsi:type="string">summary-block-config</item>
                </item>
                <item name="children" xsi:type="array">
                    <item name="block-rates" xsi:type="array">
                        <item name="component" xsi:type="string">Magento_Checkout/js/view/cart/shipping-rates</item>
                        <item name="sortOrder" xsi:type="string">2</item>
                    </item>
                    <item name="block-shipping" xsi:type="array">
                        <item name="component" xsi:type="string">Magento_Checkout/js/view/cart/shipping-estimation</item>
                        <item name="provider" xsi:type="string">checkoutProvider</item>
                        <item name="sortOrder" xsi:type="string">1</item>
                        <item name="deps" xsi:type="array">
                            <item name="0" xsi:type="string">block-summary.block-shipping.address-fieldsets</item>
                        </item>
                        <item name="children" xsi:type="array">
                            <item name="address-fieldsets" xsi:type="array">
                                <item name="component" xsi:type="string">uiComponent</item>
                                <item name="config" xsi:type="array">
                                    <item name="deps" xsi:type="array">
                                        <item name="0" xsi:type="string">checkoutProvider</item>
                                    </item>
                                </item>
                                <item name="displayArea" xsi:type="string">address-fieldsets</item>
                                <item name="children" xsi:type="array">
                                    <item name="city" xsi:type="array">
                                        <item name="sortOrder" xsi:type="string">115</item>
                                        <item name="dataScope" xsi:type="string">shippingAddress.city</item>
                                        <item name="provider" xsi:type="string">checkoutProvider</item>
                                    </item>
                                    <item name="country_id" xsi:type="array">
                                        <item name="sortOrder" xsi:type="string">110</item>
                                        <item name="dataScope" xsi:type="string">shippingAddress.country_id</item>
                                        <item name="provider" xsi:type="string">checkoutProvider</item>
                                    </item>
                                    <item name="region_id" xsi:type="array">
                                        <item name="component" xsi:type="string">Magento_Ui/js/form/element/region</item>
                                        <item name="sortOrder" xsi:type="string">112</item>
                                        <item name="config" xsi:type="array">
                                            <item name="template" xsi:type="string">ui/form/field</item>
                                            <item name="elementTmpl" xsi:type="string">ui/form/element/select</item>
                                            <item name="customEntry" xsi:type="string">shippingAddress.region</item>
                                        </item>
                                        <!-- Value of region_id field is filtered by the value of county_id attribute -->
                                        <item name="filterBy" xsi:type="array">
                                            <item name="target" xsi:type="string"><![CDATA[${ $.provider }:${ $.parentScope }.country_id]]></item>
                                            <item name="field" xsi:type="string">country_id</item>
                                        </item>
                                    </item>
                                    <!-- The following items override configuration of corresponding address attributes -->
                                    <item name="region" xsi:type="array">
                                        <!-- Make region attribute invisible on frontend. Corresponding input element is created by region_id field -->
                                        <item name="visible" xsi:type="boolean">false</item>
                                        <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                                        <item name="sortOrder" xsi:type="string">111</item>
                                        <item name="dataScope" xsi:type="string">shippingAddress.region</item>
                                    </item>
                                    <item name="postcode" xsi:type="array">
                                        <!-- post-code field has custom UI component -->
                                        <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                                        <item name="dataScope" xsi:type="string">shippingAddress.postcode</item>
                                        <item name="sortOrder" xsi:type="string">114</item>
                                        <item name="provider" xsi:type="string">checkoutProvider</item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
            <item name="checkoutProvider" xsi:type="array">
                <item name="component" xsi:type="string">uiComponent</item>
            </item>
        </item>
    </argument>
</arguments>

I am trying to remove the item named "block-shipping" in the layout above only.

I have created the following layout file:

app/design/frontend/Vendor/ThemeDir/Magento_Checkout/layout/checkout_cart_index.xml

The layout update to remove the item should be applied to this file. How can I remove the item named 'block-shipping' from the block named 'checkout.cart.shipping'?

Answer 1

Completely removing the shipping estimate block breaks a fair bit of javascript causing the total summary to not render. I recently got around this by disabling the UI Component, instead of removing the component block.

vendor/magento/module-checkout/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">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="block-summary" xsi:type="array">
                            <item name="config" xsi:type="array">
                                <item name="componentDisabled" xsi:type="boolean">true</item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

Unfortunately this leaves the section header in the summary sidebar, so you need to either hide it with css or copy Magento_Checkout::cart/shipping.phtml to your module/theme and section header markup from the template.

Answer 2

The simplest and error-free option is to hide it using CSS:

#block-shipping {
    display: none;
}

There is plenty information on internet on how to add custom CSS to specific pages in Magento 2.

Answer 3

The block you need to remove is checkout.cart.shipping

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