How to separate order review and payment methods sections in WooCommerce checkout page

Viewed 843

Problem:

on the checkout page (form-checkout.php) the following action code calls the review order AND the payment method section at the same position (after each other)

do_action('woocommerce_checkout_order_review');

However, I want the order review and payment method sections to be separate, i.e. to call them individually in different places on the checkout page.

Solution attempt:

I came across guidance here and found the file includes/wc-template-hooks.php where the above action is created with he following code:

add_action( 'woocommerce_checkout_order_review', 'woocommerce_order_review', 10 ); 
add_action('woocommerce_checkout_order_review', 'woocommerce_checkout_payment', 20 );

So to test and call ONLY the payment section separately, I went back to form-checkout.php and tried this:

do_action( 'woocommerce_checkout_payment' );

or this

do_action( 'woocommerce_checkout_payment',99 );

But neither calls the payment section!

Could anyone please help me understand why this doesn't work?

Note: I know I can register hook the woocommerce_checkout_payment to a custom function and call it that way, but I'm confused as to why the direct method doesn't work and I'd prefer to keep things simple were possible.

1 Answers

Add this lines to functions.php in your child-theme:

// Detaching `payment` from `woocommerce_checkout_order_review` hook
remove_action('woocommerce_checkout_order_review', 'woocommerce_checkout_payment', 20 );
// Attaching `payment` to my `woocommerce_checkout_payment_hook`
add_action('woocommerce_checkout_payment_hook', 'woocommerce_checkout_payment', 10 ); 

now you can use the custom hook to show the payment section:

do_action( 'woocommerce_checkout_payment_hook' );

P.S. Thank you @LoicTheAztec for the solution.

Related