Multistep checkout for woocommerce can be used to convert your checkout page into multisteps.

Phoeniixx

<p><a href="http://mltistepcheckoutfree.phoeniixxdemo.com/" rel="nofollow ugc">FREE VERSION DEMO LINK</a> | <a href="http://mltistepcheckoutfree.phoeniixxdemo.com/wp-content/uploads/2018/06/Multistep-checkout.pdf" rel="nofollow ugc">FREE VERSION DOCUMENTATION LINK</a></p>
<h4>Overview</h4>
<p>Multistep checkout for woocommerce can be used to convert your checkout page into multisteps.</p>
<h4>Free Features:</h4>
<ul>
<li>Editable all the labels and buttons</li>
<li>Combine Billing and shipping form in a Single tab.</li>
<li>Combine order review and payment form in a single tab.</li>
<li>Styling options are available.</li>
<li>Convert your checkout page into five steps – Login, Billing, Shipping, Review Order, and Payments</li>
</ul>
<p><a href="http://mltistepcheckoutfree.phoeniixxdemo.com/" rel="nofollow ugc">FREE VERSION DEMO LINK</a> | <a href="http://mltistepcheckoutfree.phoeniixxdemo.com/wp-content/uploads/2018/06/Multistep-checkout.pdf" rel="nofollow ugc">FREE VERSION DOCUMENTATION LINK</a></p>
<p><strong>Take a look at how to set up Multistep Checkout in Woocommerce</strong><br />
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/9VGQOzypEqk?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<h4>Premium Features:</h4>
<p><a href="http://multistepcheckout.phoeniixxdemo.com/checkout/" rel="nofollow ugc">PREMIUM VERSION LIVE DEMO</a> | <a href="https://www.phoeniixx.com/product/multistep-checkout-for-woocommerce/" rel="nofollow ugc">PREMIUM VERSION LINK</a> | <a href="https://www.phoeniixx.com/wp-content/uploads/2017/02/Multistep-Checkout.pdf" rel="nofollow ugc">DOCUMENTATION LINK</a></p>
<h4>Global Settings</h4>
<ul>
<li> Option to enable or disable Checkout plugin. </li>
<li> Option to select the checkout style type.</li>
<li> Option to set the tab alignment in the Centre, Left, or in Right.</li>
<li> Option to change the label for Login, Billing, Shipping, Order info,and Payment.</li>
<li><strong>New:</strong> Option to combine the Billing and Shipping details.</li>
</ul>
<h4>Style 1</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the icon background color.</li>
<li> Option to set the icon active background color.</li>
<li> Option to set the icon border color.</li>
<li> Option to set the icon border active color.</li>
<li> Option to set the number color.</li>
<li> Option to set the number active color.</li>
<li> Option to set the padding.</li>
</ul>
<h4>Style 2</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the border bottom active color.</li>
<li> Option to set the background color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the margin for the tabs.</li>
<li> Option to set the padding.</li>
</ul>
<h4>Style 3</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the arrow color.</li>
<li> Option to set the background color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the margin for the tabs.</li>
<li> Option to set the padding in left.</li>
<li> Option to set the padding in right.</li>
</ul>
<h4>Style 4</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the margin for the tabs.</li>
<li> Option to set the padding .</li>
<li> Option to set the border radius.</li>
<li> Option to set the alignment for text in Centre , Left or in Right.</li>
</ul>
<h4>Style 5</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the margin for the tabs.</li>
<li> Option to set the padding .</li>
<li> Option to set the border bottom color.</li>
<li> Option to choose the border bottom style- Solid, Dotted, Dashed, Double, Groove, and Hidden.</li>
<li> Option to set the border bottom width.</li>
<li> Option to set the border radius.</li>
</ul>
<h4>Style 6</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the icon background color.</li>
<li> Option to set the icon active background color.</li>
<li> Option to set the number color.</li>
<li> Option to set the number active color.</li>
<li> Option to set the padding in left.</li>
<li> Option to set the padding in right.</li>
</ul>
<h4>Style 7</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background color.</li>
<li> Option to set the  background active color.</li>
<li> Option to set the number color.</li>
<li> Option to set the number background color.</li>
<li> Option to set the padding in left.</li>
<li> Option to set the padding in right.</li>
</ul>
<h4>Style 8</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the padding .</li>
<li> Option to set the margins.</li>
</ul>
<h4>Style 9</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the padding.</li>
<li> Option to set the margins.</li>
</ul>
<h4>Style 10</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the number color.</li>
<li> Option to set the number active color.</li>
<li> Option to set the number background color.</li>
<li> Option to set the number background active color.</li>
<li> Option to set the border size.</li>
<li> Option to set the border style- Solid, Dotted, Dashed, Double, Groove, and Hidden.</li>
<li> Option to set the border color.</li>
<li> Option to set the padding.</li>
<li> Option to set the margins.</li>
</ul>
<h4>Style 11</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the text active color.</li>
<li> Option to set the background active color.</li>
<li> Option to set the background hover color.</li>
<li> Option to set the background color.</li>
<li> Option to set the border size.</li>
<li> Option to set the border style- Solid, Dotted, Dashed, Double, Groove, and Hidden.</li>
<li> Option to set the border color.</li>
<li> Option to set the padding.</li>
</ul>
<h4>Style 12</h4>
<ul>
<li> Option to set the text size. </li>
<li> Option to select the font weight- Normal, Bold, Bolder and Lighter.</li>
<li> Option to set the text color.</li>
<li> Option to choose the text transform – Uppercase and Lowercase.</li>
<li> Option to set the background color.</li>
<li> Option to set the padding.</li>
<li> Option to set the margins.</li>
</ul>
<p><a href="http://multistepcheckout.phoeniixxdemo.com/checkout/" rel="nofollow ugc">PREMIUM VERSION LIVE DEMO</a> | <a href="https://www.phoeniixx.com/product/multistep-checkout-for-woocommerce/" rel="nofollow ugc">PREMIUM VERSION LINK</a> | <a href="https://www.phoeniixx.com/wp-content/uploads/2017/02/Multistep-Checkout.pdf" rel="nofollow ugc">DOCUMENTATION LINK</a></p>
<h4>Premium WordPress Themes</h4>
<p>Here is our premium wordpress theme</p>
<ul>
<li><a href="https://www.phoeniixx.com/product/foody/" rel="nofollow ugc">Foody Themes</a></li>
<li><a href="https://www.phoeniixx.com/product/jstore-theme/" rel="nofollow ugc">Jstore Themes</a></li>
<li><a href="https://www.phoeniixx.com/product/eezy-store/" rel="nofollow ugc">Eezy Themes</a></li>
<li><a href="https://www.phoeniixx.com/product/craze/" rel="nofollow ugc">Craze Themes</a></li>
<li><a href="https://www.phoeniixx.com/product/seofication/" rel="nofollow ugc">Seofication Themes</a></li>
<li><a href="https://www.phoeniixx.com/product/news-prime/" rel="nofollow ugc">News Prime Themes</a></li>
</ul>
<blockquote>
<h4>Our Website</h4>
<ul>
<li>  <a href="https://www.phoeniixx.com/" rel="nofollow ugc">https://www.phoeniixx.com/</a></li>
</ul>
<h4>Support Email</h4>
<ul>
<li>  <a href="mailto:support@phoeniixx.com" rel="nofollow ugc">support@phoeniixx.com</a></li>
</ul>
<h4>NOTE</h4>
<ul>
<li>  Our plugin support the Multisite Network.
</li>
</ul>
</blockquote>


Multistep Checkout for  Woocommerce

It works good. however, select2.js in checkout page doesn't work in checkout page with select input element when user is doing checkout without log in. If you are able to fix this, I would give you 5 stars. Anyway, great job !

Alternatives to Multistep Checkout for Woocommerce

Top alternatives