How to make order on WooCommerce Cart page (skip Checkout page)

Make order by manual on cart page in WooCommerce

WooCommerce tasks are enough different. Today we’ll consider how make order by manual. So, let’s start!

Problem: Need make order on cart page in WooCommerce, skip checkout step.

Solution: In the Network I found solutions that's resolve it question, but they suggest redefining templates. This solution less beautiful, but in some case can might be of use to someone. So, yet we'll need Contact Form 7.

Step 1. Make contact form using Contact Form 7 plugin and add hidden field [hidden order-info] to form. After then add shortcode output contact form on our page template (cart.php).

Step 2. Add next function to JS file:

function getProductsIDsAfterSendForm() {
	$( '.wpcf7-form' ).submit( function ( e ) {
		var orderInfo = {};
		// Get Products IDs from cart table
		$( '.woocommerce-cart-form tr' ).each( function () {
			orderInfo[$( this ).data( 'id' )] = $( this ).find( '.qty' ).val();
		} );
		// Add Products IDs to our hidden field
		$( '.wpcf7-form input[name*="order-info"]' ).val( JSON.stringify( orderInfo ) );
	} );
}

Step 3. Add next code to our functions.php file:

<?php 
...
// Add Order After Success Send Email Form
add_action( 'wpcf7_mail_sent', function ( $cf7 ) {
	$submission = WPCF7_Submission::get_instance();
	if ( ! $submission ) {
		return;
	}
	$posted_data = $submission->get_posted_data();
		
	$cart_items = json_decode( stripcslashes( $posted_data['order-info'] ), true );
		
	// Additional Sanitize
	$sanitize_cart_items = [];
	foreach ( $cart_items as $sanitize_cart_key => $sanitize_cart_item ) {
		if ( ( $sanitize_cart_key && $sanitize_cart_item ) > 0 ) {
			$sanitize_cart_items[ absint( $sanitize_cart_key ) ] = absint( $sanitize_cart_item );
		}
	}
		
	$address = [
		'first_name' => $posted_data['customer-name'],
		'last_name' => '',
		'email' => $posted_data['customer-email'],
		'organization' => $posted_data['organization-name'],
		'phone' => $posted_data['customer-phone'],
		'address_1' => $posted_data['address'],
		'address_2' => '',
		'city' => '',
		'postcode' => '',
	];
		
	$order = wc_create_order();
	
	if ( $sanitize_cart_items ) {
		foreach ( $sanitize_cart_items as $product_id => $qty ) {
			$order->add_product( wc_get_product( $product_id ), $qty );
		}
			
		$order->set_address( $address, 'billing' );
			
		$order->add_order_note(
			'Additional Info: ' . $posted_data['add-info'] . '</br>' .
			'Intended use: ' . $posted_data['using'] . '</br>' .
			'How did you hear about as? ' . $posted_data['info'] . '</br>'			
		);
			
		// Set payment gateway
		$payment_gateways = WC()->payment_gateways->payment_gateways();
		$order->set_payment_method( $payment_gateways['cod'] );
			
		// Calculate totals
		$order->calculate_totals();
		$order->update_status( 'processing', 'In Store ', TRUE );
			
		$order->save();
			
		// Reset Cart After Success Contact Form
		WC()->cart->empty_cart();
	}
} );
	
// Hide Cart Table & Contact Form After Success Contact Form
add_action( 'wp_footer', 'remove_cart_and_form_after_success_sent_contact_form', 99 );
	
function remove_cart_and_form_after_success_sent_contact_form() { 
	if ( is_cart() ) : ?>
    <script>
		document.addEventListener( 'wpcf7mailsent', function ( event ) {
			document.addEventListener( 'wpcf7mailsent', function ( event ) {
				$( '#woocommerce-cart-form' ).fadeOut( 'slow', function () {
					$( '#woocommerce-cart-form' ).remove();
					$( 'h1' ).after( '<div class="woocommerce-notices-wrapper"><p class="cart-empty woocommerce-info">Your cart is empty.</p></div>' ).fadeIn( 1000 );
				} );
			}, false );
		}, false );
       </script>
	<?php
}

Yes, of course we can add script from step 2 using functions.php, but I don't know how ok it'll works, because I closed this project at the time of writing this article.

<?php 
...
// Get Products IDs After Send Form
add_action( 'wp_footer', 'get_products_ids_after_submit_form', 98 );
	
function get_products_ids_after_submit_form() { 
	if ( is_cart() ) : ?>
    <script>
		document.addEventListener( 'wpcf7submit', function ( event ) {
			var orderInfo = {};
			// Get Products IDs from cart table
			$( '.woocommerce-cart-form tr' ).each( function () {
				orderInfo[$( this ).data( 'id' )] = $( this ).find( '.qty' ).val();
			} );
			// Add Products IDs to our hidden field
			$( '.wpcf7-form input[name*="order-info"]' ).val( JSON.stringify( orderInfo ) );
		}, false );
       </script>
	<?php
}

Source:

1. https://stackoverflow.com/questions/54101536/script-to-add-manual-order-to-woocommerce