WC All Products Block Title Rendering

Hi @christiangoyippi,

Can you ensure this still occurs when using a default theme, such as Storefront?

I’ve tried to duplicate this locally, but the title is labelled as an <a> inside of an <h2> element.

Screenshot – https://d.pr/i/BrrcPH

Thank you,
Joey

Hi Joey,

yes, it occurs with a default theme (twenty twenty), no other plugins activated than WooCommerce.

The link inside the <h2> is rendered correctly but not the link text. All content inside the <a> is rendered as text even if it contains html tags like <br/> or <span>.

You can duplicate the behaviour like this:
1. Add additional HTML tags via the “woocommerce_product_title” filter (or just add html markup to your product title)
2. Insert the “All Products” Block

All the best
Christian

• This reply was modified 5 years, 1 month ago by Christian Roth.
• This reply was modified 5 years, 1 month ago by Christian Roth.

Hello Christian,

Thanks for getting back with us. I was able to duplicate this on my test site as well.

I saw you were able to get this reported on GitHub. Thank you so much for taking the time to do that! That lets the developers know about this so they can get it fixed for everyone.

If there’s anything we can do, please let us know.

Thanks again!

Hello @3sonsdevelopment

There are different solutions the WooCommerce team can follow, the simpler one would be use the RawHTML. I’ll describe the process with the code of the “/wp-content/plugins/woocommerce/packages/woocommerce-blocks/build/all-products-frontend.js” file.

1. Open this file with the text editor of your choice.

2. Go to the piece of code:

return React.createElement(s,{className:R()(t,"".concat(i,"__product-title"))},c?React.createElement("a",{href:r.permalink,rel:"nofollow"},u):u)

3. Edit it as follows:

return React.createElement(s,{className:R()(t,"".concat(i,"__product-title"))},c?React.createElement("a",{href:r.permalink,rel:"nofollow"},React.createElement( wp.element.RawHTML, null,u )):React.createElement( wp.element.RawHTML, null,u ))

4. Finally, clear the browser’s cache, after edit the online file.

Best regards.

Is this problem similar to what I’m having?

Variable products appear at TAG <span> – </span>

Printscreen:
https://scontent.fcgh12-1.fna.fbcdn.net/v/t1.0-9/102802575_3258374800849382_5689081137098850572_o.jpg?_nc_cat=105&_nc_sid=825194&_nc_ohc=paFV4HfxmCoAX_WFvpX&_nc_ht=scontent.fcgh12-1.fna&oh=85be7288059e2e7d042ab53eb58e19c6&oe=5F015857

• This reply was modified 4 years, 9 months ago by ofmarconi.