EDD Checkout Wizard adds a form wizard to your checkout page with some features:

  • Customer can only pass to the next tab if the form is correctly completed
  • Forces to scroll to the bottom of the screen to click the next button
  • Possibility to navigate to previously validated tabs
  • Checks changes from payment method selection

Current tabs distribution:

  • Overview: Displays cart and recommended products (if EDD Recommended Products is active)
  • Payment Method: Displays available payment methods, if there is only one or none, then this tab is removed
  • Account: Displays login/register form or the account information
  • Billing Address: Displays billing address information and EU VAT information (if EDD VAT is active)
  • Payment: Last tab with cart total and purchase button

EDD Checkout Wizard has support for this third-party plugins:

  • EDD Recommended Products
  • EDD VAT

This plugin requires Easy Digital Downloads.

How can I customize tabs?

First of all you need add a filter to changes how tabs are rendered, and at this point you could add, change or move tabs.

This is the structure for a tab:

$tab = array(
    'tab-identifier' => array(
        'label' => 'My tab',
        'selectors' => array(
            '#my-element',
            '.group-of-elements',
        )
    )
);

This is an example of tab customization:

function custom_checkout_tabs( $tabs ) {
    // Adding a meta box to general tab
    $tabs['overview']['selectors'][] = '#my-element';

    // Moving a tab
    $temp_tab = $tabs['address'];

    unset($tabs['address']);

    $tabs['address'] = $temp_tab;

    // Removing a tab
    unset($tabs['account']);

    return $tabs;
}

add_filter( 'edd_checkout_wizard_checkout_tabs', 'custom_checkout_tabs');

Note: Elements that are not in a tab will be kept always visible