“Featured Product” Broken Background Image

So, two days later and not a single response? C’mon guys, you’ve got to do better than that.

Hi there @kfutter,

Thanks for contacting us.

I understand the background image on a featured product on your site’s home page is not loading up.

I had a look at the homepage, it looks like for some reason, the HTML code for the featured product is broken:

Could you try deleting the block and adding it fresh?

If that doesn’t work – could you edit the image in WP Admin > Media and remove all the content which is in the Alternative Text box? Once done, try re-adding the featured product block.

(Please note that the Featured Product block is a part of the WooCommerce core plugin.)

I hope this helps! ??

• This reply was modified 2 years, 6 months ago by Kaushik S. a11n.

Hi there,

Thanks for responding. I’ve deleted and re-added the block many times, to no avail. It’s broken on all pages I display it on, regardless of what product I choose as the actual featured product. The alt text field was blank, so I tried adding something there, then deleting and re-adding the block, but it had no effect. I think this is a bug; it works fine in the edit-mode preview.

Hello again. I’m back to report some findings. After setting up WP-Staging and disabling all but the vital plugins, the Featured Product background image starting working again. The first plugin I re-enabled, however, was Woocommerce Blocks, and the background immediately stopped working again. So, it appears one of you has a bug with respect to the other.

Hi @kfutter

Thank you for the report and the followup feedback. From reports we have gathered after the release of WooCommerce Blocks 7.5 it seems that the block is not correctly filtering the alt text in the product image. This means that where the alt text is being automatically picked up – such as in the code above – and HTML is being added, it breaks the page, since HTML is not valid in alt image text.

We’ll be bringing this to the attention of our developers, but for now, you can override this by adding manual alt text to your images.

When you say “manual alt text”, do you meaning adding it to the image meta data within the media library? If so, I’ve tried that, and it made no difference. I’ve disabled WooCommerce Blocks for now, as a quick audit told me that I wasn’t using any of its features anyway.

Hi there,

The alt text seems to be generated automatically.

I understand you don’t need any of WooCommerce Blocks features now so you’ve disabled the plugin. I’m going to mark this as resolved – if you have any further questions, you can start a new thread.