Remove sidebar in checkout custom step - Magento 2

Question

I have created a new custom step in the checkout and I want to hide the sidebar in this custom step.

Note: I only want to hide the sidebar in my custom step, not in other steps.

Does anyone know how I can achieve this?

Thanks

Answer 1

Remove sidebar for only one step is not posibble you have to use custom js int your theme.

In your case, you have to hide summary block for first step using below code in your custom step js file.

add parent class so we can hide sidebar block

initialize: function () {
    this._super();
    // register your step
    stepNavigator.registerStep(
       'customerstep', 
        null,
        $t('customer'),
        //observable property with logic when display step or hide step
        this.isVisible,                     
        _.bind(this.navigate, this),
        30
    ); 

    $('#checkout').addClass('customer-step');

    return this;
}

add css

.customer-step .opc-sidebar { display:none; }

Now you have to override step-navigator.js file into your theme.

in step-navigator.js file,

go to next() function

next: function() add line $('#checkout').removeClass('customer-step'); inside this condition,

if (steps().length > activeIndex + 1) {
    $('#checkout').removeClass('customer-step');
}

Answer 2

You can remove sidebar by add below code to override checkout_index_index.xml to in your theme

Add code below code just after <item name="sidebar" xsi:type="array"> tag

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

Clean cache and check.

Answer 3

You can add below code to override checkout_index_index.xml

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

Clean cache and check.

Answer 4

There is no left sidebar, it's just one page checkout (all in one). You can find Mageplaza One Step Checkout.