Embedded checkouts in WooCommerce

The Krokedil plugins with embedded, or iframe-based, checkouts are Avarda Checkout, Dintero Checkout, Kustom Checkout, Nexi Checkout, Walley Checkout and Qliro.

While Klarna for WooCommerce is, strictly speaking, not an embedded checkout, some of the information in this article can still be applied.

Keep the standard WooCommerce checkout fields available

When using an embedded checkout, you need to have all the fields available in the WooCommerce checkout.

For all address fields in the embedded checkout to be saved correctly in WooCommerce, the same fields need to be available in the standard WooCommerce checkout form. If you have made changes to this setup, it can cause address data from the order to not be saved correctly to the order in WooCommerce.

One example of this could be, but is not limited to, that you have set Company name to Hidden under Appearance → Customize → WooCommerce → Checkout. If you then accept B2B purchases with your embedded checkout, the field for Company name cannot be saved to the WooCommerce order since this field does not exist. 

As a result, this information is missing in your WooCommerce store. If, for instance, you print your shipping labels from WooCommerce, or use this data as a basis for a third-party service, the Company name will not be included.

Make the checkout address field “State” not required

There are some countries where WooCommerce has the checkout field State set as required, but the embedded checkout does not include this field for that country. This can cause an error where the order isn’t created at all in WooCommerce.

With this filter, you can make the State field optional to avoid a checkout error in the communication with your payment provider when you have an embedded checkout.

add_filter( 'woocommerce_billing_fields', 'myprefix_billing_state_unrequired', 10, 1 );
 
add_filter( 'woocommerce_shipping_fields', 'myprefix_shipping_state_unrequired', 10, 1 );
 
 
 
function myprefix_billing_state_unrequired( $address_fields ) {
 
                $address_fields['billing_state']['required'] = false;
 
                return $address_fields;
 
}
 
 
 
function myprefix_shipping_state_unrequired( $address_fields ) {
 
                $address_fields['shipping_state']['required'] = false;
 
                return $address_fields;
 
}

Callbacks

During a purchase with an embedded checkout solution, there are a number of HTTP requests back and forth to keep WooCommerce and the payment provider in sync. It’s important that these requests can be executed without being blocked; otherwise the customer will not be able to create an order in WooCommerce.

Read more about Callbacks and how to prevent issues.