[Support request] Adding infographic to product description in Woo

[Alex]

Hi! I’ve tried to add some html code of Gutenberg block to the short product description field in vain. Could you please suggest a solution for adding svg icon lists and rows of icons to the short or long product description?

[David]

Hi there,

what HTML are you trying to add that isn’t working ?

[Alex]

I’ve tried to add a subtitle and a listing with icons. Looks like not all styles are applied correctly screenshot

[David]

Can you share the actual HTML Code you added ?

[Alex]

I made it on the other empty page and copied the code:

<!-- wp:generateblocks/headline {"uniqueId":"28a21e5b"} -->
<h2 class="gb-headline gb-headline-28a21e5b gb-headline-text">Some title</h2>
<!-- /wp:generateblocks/headline -->

<!-- wp:generateblocks/headline {"uniqueId":"f843fed2","element":"p","hasIcon":true} -->
<p class="gb-headline gb-headline-f843fed2"><span class="gb-icon"><svg aria-hidden="true" role="img" height="1em" width="1em" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"></path></svg></span><span class="gb-headline-text">listing 1 </span></p>
<!-- /wp:generateblocks/headline -->

<!-- wp:generateblocks/headline {"uniqueId":"0ee30e71","element":"p","hasIcon":true} -->
<p class="gb-headline gb-headline-0ee30e71"><span class="gb-icon"><svg aria-hidden="true" role="img" height="1em" width="1em" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"></path></svg></span><span class="gb-headline-text">listing 2 </span></p>
<!-- /wp:generateblocks/headline -->

<!-- wp:generateblocks/headline {"uniqueId":"c1cc87dc","element":"p","hasIcon":true} -->
<p class="gb-headline gb-headline-c1cc87dc"><span class="gb-icon"><svg aria-hidden="true" role="img" height="1em" width="1em" viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"></path></svg></span><span class="gb-headline-text">listing 3 </span></p>
<!-- /wp:generateblocks/headline -->

[David]

Hmmm…. can you share a link to the page where you set the List up – so i can see what CSS is generated.
And a link to the product where you added the HTML.

[Author]

Posts