ACF block output breaks due to wp_kses() on woocommerce checkout page

• marloesg

• June 26, 2021 at 12:51 am

Hi,

When the terms and conditions page is created with ACF custom gutenberg blocks with an wysiwyg editor and there is a link within the content of the wysiwyg editor the output of this block on the checkout page of woocommerce in the Terms and conditions hidden preview block (the one that opens within the checkout page when you click on the terms and conditions link of the checkbox) contains the ACF block code instead of valid html output.

See image of generated html:
https://pasteboard.co/K8fPCY6.jpg

While debugging I have found that when the function “wp_kses_post” (this function calls wp_kses()) that filters the post content is removed the html output is just fine. So wp_kses_post does something that breaks the wysiwyg content when there is a link in the text.

The function is executed here:
Woocommerce wc-template-functions.php line 875:

/**
 * Output t&c page's content (if set). The page can be set from checkout settings.
 *
 * @since 3.4.0
 */
function wc_terms_and_conditions_page_content() {
	$terms_page_id = wc_terms_and_conditions_page_id();

	if ( ! $terms_page_id ) {
		return;
	}

	$page = get_post( $terms_page_id );

	if ( $page && 'publish' === $page->post_status && $page->post_content && ! has_shortcode( $page->post_content, 'woocommerce_checkout' ) ) {
		echo '<div class="woocommerce-terms-and-conditions" style="display: none; max-height: 200px; overflow: auto;">' . wc_format_content( wp_kses_post( $page->post_content ) ) . '</div>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	}
}

When there is no link in the wysiwyg the output is just fine.

I cannot change this core woocommerce function without hacking into the plugin code. Has anyone an idea what I can do to fix this?

• bradt

• January 18, 2022 at 4:04 pm

I’m having the same issue. In my case, in addition to links in the WYSIWYG fields, ACF Gutenberg blocks are also getting mangled. My guess is that there’s a WC hook that would allow us to change the function from wp_kses to apply_filters( ‘the_content’… Just need to figure out where it lives.

• bradt

• January 18, 2022 at 4:22 pm

I found the hook. This worked for me, if anyone is also having issues with links or gutenberg blocks in the WooCommerce checkout terms and conditions checkbox field:

/**
 * Replace wc_terms_and_conditions_page_content to apply the_content filter to markup
 */
function my_wc_terms_and_conditions_page_content() {
	$terms_page_id = wc_terms_and_conditions_page_id();

	if ( ! $terms_page_id ) {
		return;
	}

	$page = get_post( $terms_page_id );

	if ( $page && 'publish' === $page->post_status && $page->post_content && ! has_shortcode( $page->post_content, 'woocommerce_checkout' ) ) {
		//echo '<div class="woocommerce-terms-and-conditions" style="display: none; max-height: 200px; overflow: auto;">' . wc_format_content( wp_kses_post( $page->post_content ) ) . '</div>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		echo '<div class="woocommerce-terms-and-conditions" style="display: none; max-height: 200px; overflow: auto;">' . apply_filters( 'the_content', $page->post_content ) . '</div>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	}
}
remove_action( 'woocommerce_checkout_terms_and_conditions', 'wc_terms_and_conditions_page_content', 30 );
add_action( 'woocommerce_checkout_terms_and_conditions', 'my_wc_terms_and_conditions_page_content', 30 );

• perry89

• November 13, 2023 at 6:16 am

Thank you so much! Had the same problem. Solutions works like a charm!