Create a better user experience by splitting the checkout process in several steps. This will also improve your conversion rate.
The plugin was made with the use of the WooCommerce standard templates. This ensure that it should work with most the themes out there. Nevertheless, if you find that something isn’t properly working, let us know in the Support forum.
- Sleak design
- Mobile friendly
- Responsive layout
- Adjust the main color to your theme
- Inherit the form and buttons design from your theme
- Keyboard navigation
Tags: multistep checkout, multi-step-checkout, woocommerce, checkout, shop checkout, checkout steps, checkout wizard, checkout style, checkout page
- From the WP admin panel, click “Plugins” -> “Add new”.
- In the browser input box, type “Multi-Step Checkout for WooCommerce”.
- Select the “Multi-Step Checkout for WooCommerce” plugin and click “Install”.
- Activate the plugin.
- Download the plugin from this page.
- Save the .zip file to a location on your computer.
- Open the WP admin panel, and click “Plugins” -> “Add new”.
- Click “upload”.. then browse to the .zip file downloaded from this page.
- Click “Install”.. and then “Activate plugin”.
- Download the plugin from this page.
- Extract the .zip file to a location on your computer.
- Use either FTP or your hosts cPanel to gain access to your website file directories.
- Browse to the
- Upload the extracted
wp-multi-step-checkoutfolder to this directory location.
- Open the WP admin panel.. click the “Plugins” page.. and click “Activate” under the newly added “Multi-Step Checkout for WooCommerce” plugin.
The login form isn’t showing in the wizard
Please check the ‘Display returning customer login reminder on the “Checkout” page’ option found on the WP Admin -> WooCommerce -> Settings -> Accounts page
Is the plugin GDPR compatible?
The plugin doesn’t add any cookies and it doesn’t modify/add/delete any of the form fields. It simply reorganizes the checkout form into steps.
My checkout page still isn’t multi-step, though the plugin is activated
Make sure to purge the cache from any of the caching plugins, or of reverse proxy services (for example CloudFlare) you’re using.
Another possible cause could be that the checkout page isn’t using the default [woocommerce_checkout] shortcode. For example, the Elementor Pro checkout element replaces the default [woocommerce_checkout] shortcode with its HTML counterpart. Go to the “WP Admin -> Pages” page, open the checkout page for editing and make sure the [woocommerce_checkout] is present there.
Contributors & Developers
“Multi-Step Checkout for WooCommerce” is open source software. The following people have contributed to this plugin.Contributors
“Multi-Step Checkout for WooCommerce” has been translated into 9 locales. Thank you to the translators for their contributions.
Interested in development?
- Fix: add a “clear: both” element between the step tabs and the validation error messages, so they don’t optically overlap
- Compatibility with the Botiga theme.
- Feature: add the “wmsc_delete_step_by_category” filter
- Tweak: place the login validation error messages under the step tabs
- Fix: no new line was added when the Enter key was hit inside the “Order notes” field.
- Feature: add common customizations to the assets/js/script.js file
- Feature: add the “data-current-title” attribute to the steps
- Fix: the Shipping section was missing on the Neve theme
- Fix: the Order section was missing when the Elementor Pro Checkout widget was used on the checkout page
- Fix: compatibility with the OceanWP theme
- Fix: the multi-steps weren’t loading if the “Fallback Modus” option from the Germanized plugin is enabled.
- Fix: compatibility with the Local Pickup Plus plugin by SkyVerge
- Compatibility with the themes by
- Fix: move the “woocommerce-notices-wrapper” before the step tabs
- Fix: the select2 was not initialized on the shipping country and shipping state fields
- Fix: check if window.location.hash is defined before using it
- Fix: missing steps content when the Avada Builder plugin is active
- Tweak: add “wpmc-no-back-to-cart” CSS class
- Fix: correct the “Show the Login step” message
- Fix: increase the priority for the “woocommerce_locate_template” filter
- Tweak: add “btn-color-primary” CSS class to the buttons under the WoodMart theme
- Modify the plugin’s name from WooCommerce Multi-Step Checkout to Multi-Step Checkout for WooCommerce
- Add the “woocommerce_checkout_logged_in_message” filter
- Fix: the Login section was misplaced in the Neve theme
- Fix: replace the $text_domain with a string
- Test with PHP 8.0, WordPress 5.6, WooCommerce 4.8, jQuery 3.5.1
- Fix: use “flex-end” instead of “right” for the navigation buttons
- Test with WooCommerce 4.5
- Fix: “Your Order” section under the Electro theme
- Test with WooCommerce 4.4
- Fix: sale badges were missing on the Astra theme
- Fix: the “prev” and “next” buttons were present on the first and the last step if the theme was declaring a “display: inline-block !important” rule on the buttons
- Fix: add function to load the default WooCommerce template files. Useful for conflicts with some themes.
- Compatibility with the Porto theme
- Declare compatibility WooCommerce 4.1
- Declare compatibility WooCommerce 4.0
- Declare compatibility WordPress 5.4
- Tweak: add
wmsc_buttons_classfilter for the buttons class
- Declare compatibility WooCommerce 3.9
- Fix: “prev” or “next” button wouldn’t hide when necessary on theRetailer theme
- Tweak: write navigation buttons with “flex” for a better responsible design
- Fix: add CSS rule for a one-step checkout wizard
- Fix: use “self” instead of “this” in the “wpmc_switch_tab” JS hook
- Fix: the coupon was showing on the Payment step instead of the Order step on the Bridge theme
- Fix: product titles disappeared from the product category pages on the Astra theme
- Fix: the “Your Order” section on Avada theme was hidden
- Fix: the “Shipping” section on the Astra theme was missing
- Fix: The “Your Order” section on the Shopper theme was not full width
- Tweak: add an element with “clear:both” after the buttons, so they don’t get covered with the next element
- Fix: the steps don’t scroll up to the top on the Flatsome theme because of the sticky menu
- Feature: when opening the /checkout/ page, open a specific tab with the #step-1 URL hash
- Fix: if “Ship to a different address?” not selected, don’t switch tab to Shipping when an error is found
- Fix: don’t show server-side errors on the login step
- Change steps order for RTL language websites
- Fix: compatibility with the SendCloud plugin
- Fix: add the
woocommerce_checkout_after_customer_detailshook also when the Shipping step is removed
- Fix: the legal terms were showing twice with WooCommerce Germanized
- Fix: the coupon form was not showing up
- Show warning about an option in the German Market plugin
- Warning: plugin incompatible with the Suki theme
- Code refactory so to allow programatically to add/remove/modify steps
- Fix small issues with the WooCommerce Germanized plugin
- Declare compatibility with WordPress 5.2
- Feature: compatibility with the WooCommerce Points and Rewards plugin
- Declare compatibility with WooCommerce 3.6
- Tweak: update the Bootstrap library used in the admin side to 3.4.1 version
- Fix: the “Your Order” section is squished in half a column on the Storefront theme
- Fix: don’t toggle the coupon form on the Avada theme
- Fix: remove constantly loading icon from the Zass theme
- Fix: design error with WooCommerce Germanized and “Order & Payment” steps together
- Fix: small design fixes for the Avada theme
- Admin notice for “WooCommerce One Page Checkout” option for Avada theme
- Fix: PHP warnings when WooCommerce Germanized isn’t installed
- Fix: use the available strings from WooCommerce Germanized so the translation doesn’t break
- Fix: input fields for the Square payment gateway were too small
- Fix: “load_text_domain” is loaded now in the “init” hook
- Fix: the steps were shown over the header if the header was transparent
- Fix: adjust the checkout form template for the Avada theme
- Fix: with Visual Composer the “next” and “previous” buttons weren’t clickable on iPhone
- Fix: spelling errors in the nl_NL translation
- Compatibility with the WooCommerce Germanized plugin
- Tweak: show a warning about the “Multi-Step Checkout” option for the OceanWP theme
- Compatibility with the WooCommerce Social Login plugin from SkyVerge
- Add nl_NL, nl_BE, fr_CA, fr_BE, de_CH languages
- Feature: option for the sign between two united steps. For example “Billing & Shipping”
- Fix: set “padding:0” to the steps in order to normalize to all the themes
- Fix: the “WooCommerce not installed” message was showing up even if WooCommerce was installed
- Fix: small design changes for the Flatsome, Enfold and Bridge themes
- Fix: load the CSS and JS assets only on the checkout page
- remove PHP notice when WPML option isn’t enabled
- New: the plugin is multi-language ready
- Fix: warning for sizeof() in PHP >= 7.2
- Fix: rename the CSS enqueue identifier
- Tweak: rename the “Cheating huh?” error message
- Fix: PHP notice for WooCommerce older than 3.0
- Fix: message in login form wasn’t translated
- Change: add instructions on how to remove the login form
- Fix: add the
woocommerce_before_checkout_formfilter even when the login form is missing
- Compatibility with the Avada theme
- Tweak: for Divi theme add the left arrow for the “Back to cart” and “Previous” button
- Tweak: add minified versions for CSS and JS files
- Fix: unblock the form after removing the .processing CSS class
- Fix: hide the next/previous buttons on the Retailer theme
- Fix: keyboard navigation on Safari/Chrome
- Fix: correct Settings link on the Plugins page
- Fix: option for enabling the keyboard navigation
- Fix: center the tabs for wider screens
- Fix: show the “Have a coupon?” form from WooCommerce
- Fix: for logged in users show the “Next” button and not the “Skip Login” button
- Feature: allow to change the text on Steps and Buttons
- Tweak: change the settings page appearance
- Fix: change the “Back to Cart” tag from to in order to keep the theme’s styling
- Add French translation
- Add “language” folder and prepare the plugin for internationalization
- Add German translation
- Fix: the steps were collapsing on mobile
- Fix: arrange the buttons in a row on mobile
- Add a Settings page and screenshots
- Feature: scroll the page up when moving to another step and the tabs are out of the viewport
- Initial commit