WooCommerce shop page custom content broken

It’s possible to add custom content above the products on WooCommerce shop page by editing the page that is assigned as the “Shop page”.

When adding complex blocks with the new block editor (or perhaps a third party page builder) then you may find that there can be unwanted line breaks (<br>) and paragraphs (<p>) added, potentially mangling the content and making it appear broken.

Disabling WPAutop does not solve the issue, because it is actually caused by WC’s wc_format_content function, called in the woocommerce_product_archive_description function in wc-template-functions.php:

function woocommerce_product_archive_description() {
    ...
    $description = wc_format_content( wp_kses_post( $shop_page->post_content ) );
    ...
}

Luckily it’s a pluggable function, so all you need to do is to override it in your child theme’s functions.php file:

/**
 * WC override: Remove `wc_format_content` from Shop page content.
 */
function woocommerce_product_archive_description() {
	if(is_search()) {
		return;
	}
	if(is_post_type_archive('product') && in_array(absint(get_query_var('paged')), [0, 1], true)) {
		$shop_page = get_post(wc_get_page_id('shop'));
		if($shop_page) {
			$description = wp_kses_post($shop_page->post_content);
			if($description) {
				echo '<div class="page-description">' . $description . '</div>';
			}
		}
	}
}

Alternatively you can add your content manually to the woocommerce_archive_description hook instead of putting it in post content.