I have updated the checkout_index_index handle via observer. Now I want to remove the "progress Bar", "Shipping Address", "shipping methods" via observer. So I have tried the below event.

    <event name="layout_load_before">
        <observer name="load_custom_handler" instance="NameSpace\Module\Observer\LayoutLoadBefore" />


        public function execute(\Magento\Framework\Event\Observer $observer)
           $layout = $observer->getLayout();
           $layout->getUpdate()->addUpdate('<referenceBlock name="checkout.cart.shipping" display="false"/>'); 
           return $this;

Still the child elements like "Progress Bar", "Shipping address was not removed". Is there any way to remove this via Event.


As Amit mentioned, checkout blocks are not regular Magento blocks but Ui Components so the way to remove them is different.

The easiest way would be to use a layout xml file, so removing the "progress bar" for example would look something like this:


<?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">
        <referenceBlock name="checkout.root">
                <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="progressBar" xsi:type="array">
                                    <item name="config" xsi:type="array">
                                        <item name="componentDisabled" xsi:type="boolean">true</item>

I don't think there's a way to achieve the same thing using event observers but, if you want to try a similar approach you can use plugins instead, you can hook into the Magento\Checkout\Block\Checkout\LayoutProcessorInterface::progress method (which is the one that processes the blocks that make up the checkout page) and remove the blocks you don't need:


<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Checkout\Block\Checkout\LayoutProcessorInterface">
        <plugin name="vendor_removecheckoutblocks" type="Vendor\RemoveCheckoutBlocks\Plugin\LayoutProcessor"/>


namespace Vendor\RemoveCheckoutBlocks\Plugin;

class LayoutProcessor
    function afterProcess($subject, $result)
        // Remove progress bar

        return $result;

You are following Magento 1 process to change the checkout page. But Magento 2 checkout steps are totally different. In this version Magento use knockout js, jQuery UI element, rest API, local storage.

Magento 2 version steps are not manege from layout, it use knockout js, jQuery UI element, rest API, local storage.

If you want to do customization at Magento , then please follow Magento devdocs

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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