Woocommerce Review Order before Payment Woocommerce Review Order before Payment wordpress wordpress

Woocommerce Review Order before Payment


I recently came across this issue. My solution was to create a page called 'Review Order' in the back-end of Wordpress and enter the shortcode [woocommerce_checkout] in the content editor. I then create a page-review-order.php in the root of my child theme.

In my page-review-order.php, I set the following definitions:

if ( ! defined( 'THIS_IS_CHECKOUT' ) ){  define( 'THIS_IS_CHECKOUT', true );}if ( ! defined( 'THIS_IS_REVIEW') ){  define( 'THIS_IS_REVIEW', true);}

From here I was able to go through the typical checkout process and get the information I needed without much hassle, but I could swap out what parts of the process could belong to the checkout page and what parts could belong to the review page with the following:

if (defined( 'THIS_IS_REVIEW')){  $reviewPage = true;}


Looking at a WooCommerce setup that I manage, I can see that you can set a 'Cart' page in the admin through WooCommerce > Settings > Checkout (tab at the top).

Scroll down to 'Checkout Pages' and make sure you have a 'Cart Page' selected. If you don't create a page called, for example, 'Shopping Cart' and add the following shortcode to it: [woocommerce_cart]

Once you've done that, go back to the previous WooCommerce settings page and select that new page you created.

This page is placed before the billing details in the checkout process.

Let me know if this helps.


Although this might not be the perfect solution, here is how I sorted it out.

Please have a look at this stackoverflow thread.

We insert a hidden input confirm-order-flag, telling wether it is to be reviewed or already reviewed.

Then after the validation we use woocommerce_after_checkout_validation to check for this value. If it is to be reviewed, we add a fake error.

In jQuery we check for the number of errors, which will be one if it is to be reviewed and 2 (or more) if it has errors (If it has 0, you are already on the review page).

    $(document.body).on('checkout_error', function () {    var error_count = $('.woocommerce-error li').length;    var url_params = form_parameters_to_url();    if (error_count == 1) { // Validation Passed (Just the Fake Error I Created Exists)                window.location = "review_page_url";            }else{ // Validation Failed (Real Errors Exists, Remove the Fake One)                $('.woocommerce-error li').each(function(){                    var error_text = $(this).text();                    if (error_text == 'custom_notice'){                        $(this).css('display', 'none');                    }                });            }        });

On the review page url I also insert the [woocommerce_checkout] shortcode, but this time in a container with an id: #confirm_order_page.I use jQuery again, to set the value of the hidden input to 0:

$('#confirmation_form #place_order').click(function () {    $('#confirm-order-flag').val('');       });

Then it has no errors, and it passes the validation. I hide the form on the review page from css.It might not be perfect solution, but it might help you to get started with this issue.