WooCommerce checkout steps

woo-checkout.php

<?php

/**
 * Display the checkout steps so the customer knows where they are.
 *
 * The output uses classes of Bootstrap 4 and the icons of FontAwesome (Free)
**/
function onx_woocommerce_checkout_steps()
{
	echo '<nav id="woo-checkout-steps" class="nav nav-pills nav-justified mb-4" role="navigation">';
	
	global $woocommerce;
	
	$step[1] = __('Cart','woocommerce');
	$step[2] = __('Je gegevens','your-theme');
	$step[3] = __('Betalen','your-theme');
	$step[4]['success'] = __('Bedankt','your-theme');
	$step[4]['failed'] = __('Oh jee','your-theme');
	
	$classes['past'] = 'nav-item nav-link'; // classnames for steps we're past
	$classes['current'] = 'nav-item nav-link active'; // classnames of the current step
	$classes['future'] = 'nav-item nav-link disabled text-muted'; // classnames for future steps
	
	if ( is_cart() )
	{
		printf( '<a class="%s" href="%s"><strong><i class="fas fa-shopping-basket" aria-hidden="true"></i> %s</strong></a>', 
		       esc_attr( $classes['current'] ),
		       esc_url( wc_get_cart_url() ),
		       esc_attr( $step[1] )
		);
		
		printf( '<a class="%s" disabled href="%s"><i class="fas fa-address-card" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_url( $woocommerce->cart->get_checkout_url() ),
		       esc_attr( $step[2] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="far fa-credit-card" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_attr( $step[3] )
		);
		
		printf( '<a class="" disabled href="#"><i class="fas fa-heart" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_attr( $step[4]['success'] )
		);
	}
	
	if ( is_checkout() )
	{
		printf( '<a class="%s" href="%s"><strong><i class="fas fa-shopping-basket" aria-hidden="true"></i> %s</strong></a>',
		       esc_attr( $classes['past'] ),
		       esc_url( wc_get_cart_url() ),
		       esc_attr( $step[1] )
		);
		
		printf( '<a class="%s" href="%s"><strong><i class="fas fa-address-card" aria-hidden="true"></i> %s</strong></a>',
		       esc_attr( $classes['current'] ),
		       esc_url( $woocommerce->cart->get_checkout_url() ),
		       esc_attr( $step[2] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="far fa-credit-card" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_attr( $step[3] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="fas fa-heart" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_attr( $step[4]['success'] )
		);
	}
	
	if ( is_wc_endpoint_url( 'order-pay' ) )
	{
		printf( '<a class="%s" href="%s"><strong><i class="fas fa-shopping-basket" aria-hidden="true"></i> %s</strong></a>',
		       esc_attr( $classes['past'] ),
		       esc_url( wc_get_cart_url() ),
		       esc_attr( $step[1] )
		);
		
		printf( '<a class="%s " href="%s"><strong><i class="fas fa-address-card" aria-hidden="true"></i> %s</strong></a>', 
		       esc_attr( $classes['past'] ),
		       esc_url( $woocommerce->cart->get_checkout_url() ),
		       esc_attr( $step[2] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="far fa-credit-card" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['current'] ),
		       esc_attr( $step[3] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="fas fa-heart" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['future'] ),
		       esc_attr( $step[4]['success'] )
		);
	}
	
	if ( is_wc_endpoint_url( 'order-received' ) )
	{
		$order_key = isset( $_GET['key'] ) ? esc_html( $_GET['key'] ) : '';
		
		if ( isset( $order_key ) )
		{
			$order_id = wc_get_order_id_by_order_key( $order_key );
			$order = new WC_Order( $order_id );
		}
		
		printf( '<a class="%s" href="%s"><strong><i class="fas fa-shopping-basket" aria-hidden="true"></i> %s</strong></a>',
		       esc_attr( $classes['past'] ),
		       esc_url( wc_get_cart_url() ),
		       esc_attr( $step[1] )
		);
		
		printf( '<a class="%s " href="%s"><strong><i class="fas fa-address-card" aria-hidden="true"></i> %s</strong></a>', 
		       esc_attr( $classes['past'] ),
		       esc_url( $woocommerce->cart->get_checkout_url() ),
		       esc_attr( $step[2] )
		);
		
		printf( '<a class="%s" disabled href="#"><i class="far fa-credit-card" aria-hidden="true"></i> %s</a>',
		       esc_attr( $classes['past'] ),
		       esc_attr( $step[3] )
		);
		
		if ( isset( $order ) )
		{
			if ( $order->has_status( 'failed' ) )
			{
				printf( '<a class="%s" disabled href="#"><i class="fas fa-exclamation-circle" aria-hidden="true"></i> %s</a>',
				       esc_attr( $classes['current'] ),
				       esc_attr( $step[4]['failed'] )
				);
			}
			else
			{
				printf( '<a class="%s" disabled href="#"><i class="fas fa-heart" aria-hidden="true"></i> %s</a>',
				       esc_attr( $classes['current'] ),
				       esc_attr( $step[4]['success'] )
				);
			}
		}
		else
		{
			printf( '<a class="%s" disabled href="#"><i class="fas fa-exclamation-circle" aria-hidden="true"></i> %s</a>',
				esc_attr( $classes['current'] ),
				esc_attr( $step[4]['failed'] )
			);
		}
	}
			
	echo '</nav><hr class="mb-4">';
}
add_action('woocommerce_before_cart', 'onx_woocommerce_checkout_steps', 1);
add_action('woocommerce_before_checkout_form', 'onx_woocommerce_checkout_steps', 1);