Menu Close
    Hire Us Request Quote Reading List Switch to Dark Mode

    Remove layout added by js layout in magento2

    In magento2, layout on some pages are added by js layout by using ui-components.

    So, if you want to remove an component added by js layout then you can use given process:

    you need to add these lines in your layout file:

    <item name="config" xsi:type="array">
        <item name="componentDisabled" xsi:type="boolean">true</item>
    </item>

    This code is written under the component which you want to remove and at the same nesting level.

    for example: Given example is to remove discount block from checkout page.

    firstly, i have created checkout_index_index.xml file at path:
    Webkul\Test\view\frontend\layout\checkout_index_index.xml

    Now add the following code:

    <?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.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="steps" xsi:type="array">
                                        <item name="children" xsi:type="array">
                                            <item name="billing-step" xsi:type="array">
                                                <item name="component" xsi:type="string">uiComponent</item>
                                                <item name="children" xsi:type="array">
                                                    <item name="payment" xsi:type="array">
                                                        <item name="children" xsi:type="array">
                                                            <item name="afterMethods" xsi:type="array">
                                                                <item name="children" xsi:type="array">
                                                                    <item name="discount" 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>
                            </item>
                        </item>
                    </argument>
                </arguments>
            </referenceBlock>
        </body>
    </page>

    Here, componentDisabled with true value disables the respective component.

    After this code, discount code component get disabled from checkout page.

    Hope, this blog will helps you in implementation.

    Thank you 🙂

    . . .

    Comment

    Add Your Comment

    Be the first to comment.

    Back to Top
    css.php
    Hire Us!
    Brief us about your requirements and we'll get back to you.
    Woo! Hooy!
    We have just recieved your project brief and our expert will contact you shortly.
    Send Again
    Close