23

How do I remove a UI component child via Layout XML? For example, from the below xml directive in checkout_index_index.xml. How do I remove the shipping node ?

<item name="sidebar" xsi:type="array">
    <item name="children" xsi:type="array">
        <item name="summary" xsi:type="array">
            <item name="children" xsi:type="array">
                <item name="totals" xsi:type="array">
                    <item name="children" xsi:type="array">
                        <item name="subtotal" xsi:type="array">
                            <item name="config" xsi:type="array">
                                <item name="title" xsi:type="string" translate="true">Subtotal</item>
                            </item>
                        </item>
                        <item name="shipping" xsi:type="array">
                            <item name="config" xsi:type="array">
                                <item name="title" xsi:type="string" translate="true">Estimated Shipping</item>
                            </item>
                        </item>
                        <item name="grand-total" xsi:type="array">
                            <item name="config" xsi:type="array">
                                <item name="title" xsi:type="string" translate="true">Estimated Total</item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
        </item>
    </item>
</item>

The shipping node can be removed using plugin but I just thought there should be a be a better way like a remove node attribute.

2 Answers 2

35

We can read the document here: http://devdocs.magento.com/guides/v2.0/howdoi/checkout/checkout_customize.html. In your case: we can apply this guide:

<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.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="sidebar" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="summary" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="totals" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <!--Remove fields-->
                                                        <item name="subtotal" xsi:type="array">
                                                            <item name="config" xsi:type="array">
                                                                <item name="componentDisabled" xsi:type="boolean">true</item>
                                                            </item>
                                                        </item>
                                                        <item name="shipping" xsi:type="array">
                                                            <item name="config" xsi:type="array">
                                                                <item name="componentDisabled" xsi:type="boolean">true</item>
                                                            </item>
                                                        </item>
                                                        <item name="grand-total" xsi:type="array">
                                                            <item name="config" xsi:type="array">
                                                                <item name="componentDisabled" xsi:type="boolean">true</item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

The result:

enter image description here

Read more here: http://devdocs.magento.com/guides/v2.1/howdoi/checkout/checkout_customize.html#disable-a-component

[EDIT]

Disable sidebar (Order summary) at checkout page.

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="checkout"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="sidebar" xsi:type="array">
                                    <item name="config" xsi:type="array">
                                        <item name="componentDisabled" xsi:type="boolean">true</item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

enter image description here

0

I guess this is a duplicate of https://magento.stackexchange.com/a/113151/31400.

I found that removing it using componentDisabled breaks the functionality.

You'd better off just removing the heading in the shipping.phtml.

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.