Can we by default open all steps on checkout page

Hi @Abdul Moiz,

Please try adding this custom CSS codes under XStore > Theme Options > Theme Custom CSS > Global CSS:

.etheme-elementor-cart-checkout-page-column .design-type-multistep > div {
    margin-top: 25px;
    display: block !important;
}

Hope it helps!

Hi @Abdul Moiz,

Thanks it helps to open them all but wide side effects like on clicking any continue to next step button or click ing title like Billing Address. it starts jerking screen and because any area never closes so jerks are looking little issue.
Do you anyway which opens it same as you did but any heading like Billing Address is not clickable anymore as it was closing that region before and also those button to move to ntext steps are hidden.

It would require a lot of customization code to achieve this and fall out of scope our support standard services we provide.

If you are interested in pursuing a personalized customization, we kindly encourage you to submit a request through our customization panel, which can be accessed via the following link: https://www.8theme.com/account/#etheme_customization_panel. This platform will enable you to collaborate directly with our technical team to explore the possibilities.

Please note that customization services may involve additional charges. The exact cost will be determined after a detailed review of your specific requirements.

My 2nd request is can we reduce the number of fields in billing address like customer doesn’t need to fill many fields. As from elementor, its not possible or we don’t know how to do it.

We suggest you to take a look at this article: https://developer.woocommerce.com/docs/customizing-checkout-fields-using-actions-and-filters/#2-overriding-core-fields.

Best Regards,
8Theme’s Team

Hi @Abdul Moiz,

Which fields on the checkout page you want to hide/remove?

We can provide some custom codes for you based on this article: https://developer.woocommerce.com/docs/customizing-checkout-fields-using-actions-and-filters/#2-overriding-core-fields.

Best Regards,
8Theme’s Team

Hi @Abdul Moiz,

I mean there should be a way for converting the steps on checkout to all fields opened at once.
When all fields opened at once, the proceed to next step and to previous steps button and links should be hidden as well and heading like billing address should not be clickable.

Please use this custom CSS codes instead:

.etheme-elementor-cart-checkout-page-column .design-type-multistep > div {
    margin-top: 25px;
    display: block !important;
}

.etheme-elementor-cart-checkout-page-column .etheme-checkout-page-steps-footer {
    display: none;
}

.etheme-elementor-cart-checkout-page-column h3.step-title.style-underline.inited {
    pointer-events: none;
}

The other thing in billing address to reduce fields is that hide the town/ city and state fields and change label of street address to Address so that user can put only address there after country selection.
Also same applies to shipping address

To remove the City & State fields, please add the following code under functions.php file locates in your child theme:

add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

// Our hooked in function - $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
    unset( $fields['billing']['billing_city'] );
    unset( $fields['billing']['billing_state'] );

    return $fields;
}

You can remove more fields from this list:

billing_first_name
billing_last_name
billing_company
billing_address_1
billing_address_2
billing_city
billing_postcode
billing_country
billing_state
billing_email
billing_phone

Hope it helps!

Hi @Abdul Moiz,

Please also add this custom CSS code:

[data-step-name="new_account"] {
    order: 4;
}

[data-step-name="shipping_methods"] {
    order: 5;
}

[data-step-name="payment_methods"] {
    order: 6;
}

.etheme-elementor-cart-checkout-page-column.first {
    display: flex;
    flex-direction: column;
}

https://prnt.sc/XrhaMG91gWnZ

Hope it helps!

If you need anything else, please let us know.

Best Regards,
8Theme’s Team