There's HTML code showing on my lead times!
Some themes have a coding error which can lead to HTML code escaping in the lead time field.
If you experience <span>
elements being displayed with the lead time output in your theme, this is normally caused by the theme escaping all HTML using the esc_html
on the WooCommerce availability text. WooCommerce expects the availability to be run through wp_kses_post
rather than esc_html
, so that allowed HTML tags like the <span>’s in WooCommerce Lead Time can used.
This article contains advice on what to do if this happens with the lead times on your product pages.
Electro theme
We have provided the following code snippet for people who are using the Electro theme with WooCommerce Lead Time. You can either add the code snippet to your functions.php file; OR if you're not comfortable editing code then you can download this plugin and install it on your site. The plugin will do the same thing as the code snippet, so you don't need to do both.
function electro_template_loop_availability() { $availability = apply_filters( 'electro_get_availability', electro_get_availability() ); if ( ! empty( $availability[ 'availability'] ) ) : ?> <div class="availability"> <?php echo esc_html__( 'Availability:', 'electro' );?> <span class="electro-stock-availability"><p class="stock <?php echo esc_attr( $availability['class'] ); ?>"><?php echo wp_kses_post( $availability['availability'] ); ?></p></span> </div> <?php endif; }
If you already have a customised electro_template_loop_availability function then you need to change this part in your customised function:
<?php echo esc_html( $availability['availability'] ); ?>
To:
<?php echo wp_kses_post( $availability['availability'] ); ?>
Other themes
WooCommerce Lead Time includes some fallbacks that work with most themes that have this problem, however the code structure in some themes does not allow us to filter this behavior. If this happens with your theme, then you need to make some template or function modifications to correct the issue.
Generally, you will need to look at where the availability is output in the theme, and check if it is being passed through esc_html
in the template/function and change this to wp_kses_post
.
You should normally do this in a child theme to make sure your changes are not overwritten when you update the main theme.