The progress bar lets the users know how far they completed the checkout steps and how much rest they need to complete.
To enable the Progress bar option,
- Navigate to WooCommerce > Multistep Checkout > Display Settings > Progress Bar.
- Enable the Show progress bar below multistep layout option to display the progress bar.
- Once the option is enabled, choose one of the appropriate styles for the progress bar from the three different styles.
Progress bar color |
Select a color that shows the progress of the checkout steps. |
Progress bar background color |
Select a background color for the progress bar. |
Progress bar height |
Provide the required height for the progress bar. |
Progress bar step color – Active |
Select a color for the progress bar that indicates the active step.
Note: This option is only available if you have chosen progress bar showing step progression. |
4. When the changes are done, click on the Save Changes button.