How to replace with tag for main product image in WoodMart?
- This topic has 2 replies, 2 voices, and was last updated 22 hours, 52 minutes ago by
.
-
Posts
-
I’m using the WoodMart theme with Elementor and WooCommerce.
Currently, on single product pages, the main product image is rendered inside a <figure> tag with a data-thumb attribute, and the image itself is inserted dynamically via JavaScript.
Example output:
<figure data-thumb=”image-url.jpg” class=”woocommerce-product-gallery__image”></figure>This causes the image to not appear as an
tag directly in the HTML source, which leads to poor SEO and a lower score in tools like Google PageSpeed (the image is not recognized as LCP).
What I want to achieve:
Render the main product image directly in the HTML like this:
I already tested that the correct image is loaded when I bypass the JS.
Is there a setting in WoodMart to force this behavior, or do I need to override a WooCommerce template like product-image.php?If yes, which part of the theme controls this rendering?
Thanks in advance for any help!
I’m using the WoodMart theme with Elementor and WooCommerce.
Currently, on single product pages, the main product image is rendered inside a <figure> tag with a data-thumb attribute, and the actual image is inserted dynamically via JavaScript.
Example output:
<figure data-thumb=”image-url.jpg” class=”woocommerce-product-gallery__image”></figure>
This causes the image not to appear as a proper
tag in the HTML source, which negatively impacts SEO and tools like Google PageSpeed (the image is not detected as LCP).
What I want to achieve:
I would like the main product image to be rendered directly in HTML like this:
img src=”image-url.jpg” alt=”…” /
I already confirmed that the image is correctly loaded when JavaScript is bypassed.
Question: Is there a setting in WoodMart to achieve this?
Or do I need to override a WooCommerce template such as product-image.php?
If so, which part of the theme handles this rendering?Thank you for any help!
