1. Home
  2. Knowledge Base
  3. WooCommerce Lead Time
  4. Troubleshooting

There's HTML code showing on my lead times!

Electro theme WooCommerce Lead Time

An example of the problem in Electro theme

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. Please note that code snippets are aimed at developers. If you feel comfortable using them, our article on how to use code snippets can serve as a helpful guide. However, if you don't feel comfortable using them, then you should ask your developer.

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. If you'd like us to do this for you then you can use our plugin customization service.

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.

Related Articles

If searching the knowledge base hasn't answered your question, please contact support.