ThemeHigh
  • Plugins
  • Documentation
  • Support
  • Partners
  • Login
  • Getting Started
    • Overview...
  • Checkout Steps
    • How to display a Custom Section ...
    • Delete Newly Added Checkout Step...
    • Rearrange Checkout Steps...
    • How to Add a New Checkout Step?...
    • Default Checkout Steps...
  • Display Settings
    • Multistep Layout...
    • Display Progress Bar...
    • Step Index Style...
    • Additional Settings...
  • Advanced Settings
    • Other Step Settings...
    • Review Step Details...
    • Backup & Import Settings...
  • Button Settings
    • Next and previous button setting...
    • Place order Button Settings...
    • Back to cart Button Settings...
  • FAQ
    • Having trouble with the Latest V...
    • Frequently Asked Questions...
  • Compatible Plugin & Themes
    • Plugins & Themes...

Documentation/Multi-step Checkout For WooCommerce/Step Index Style

Step Index Style

Last updated on December 31, 2022

The Step index style section provides more editing options for index display settings.

To configure the index style properties:

  1. Navigate to WooCommerce > Multistep Checkout > Display Settings > Step Index Style.
  2. Enable the Activate checkmark symbol for completed step option to display the checkmark for completed steps.
  3. After the option is enabled, choose the preferred border color, background color, and tick color for the checkmark from the corresponding color pickers.
  4. From the same page itself, you can configure the step index style like index height, roundness, text color, border color, and much more.

step_index_style

Note: The checkmark for completed steps only works if the ‘Activate step-click navigation’ option in Additional Settings is disabled.

Refer to the below table to configure the same.

Step Index Style

Step index width/height

Enter the required height for the step index.

Note: Height/width of the index is applicable only if the value is less than the line height.

Step index roundness

Enter the required size for the icon roundness. The entered value should be in px or %.

Space between border and index

Provide the required space between the border and index.

Index font color

Select the index font color from the corresponding color picker.

Index font color – Active

Select the index font color for the active step.

Index border color

Select an apt color for the index border.

Index border color – Active

Select an apt border color for the index of the active step.

Index background color

Select a background color for the index.

Index background color – Active

Select a background color for the index of the active step.

This article posted in Display Settings, Multi-step Checkout For WooCommerce, Pro Documentation

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

ThemeHigh

We develop innovative WordPress plugins and themes for e-commerce and other WordPress websites.

Resources
  • Documentation
  • Support
  • Blog
  • Bestsellers
  • Affiliates
  • Partners
Policy Information
  • Terms & Conditions
  • Privacy Policy
  • Support Policy
  • Refunds Policy
  • Licenses
Security
Payment Options

© 2021 ThemeHigh. All rights reserved.

Terms and conditions, features, support, pricing, and service options subject to change without notice.