WooCommerce Placeholder Image Won't Show

I have the placeholder image filled in both in the WooCommerce settings and in Pro’s theme settings but it still shows broken images when an image isn’t present. What am I doing wrong?

https://findelectronicparts.com/product-category/circuit-breaker

Hello @co50,

Thanks for writing to us.

Please make sure you have set the placeholder image on the WooCommerce. To set it you need to go to the WooCommerce—>Settings ---->Product—>Placeholder Image.

You can set the image ID here or the Image URL.

In case you have set it and still, the placeholder image is not showing, Please make sure you are using the Product Image element.

Tesxproduct-Layout-Builder-Pro (3)

In case you are using the Image element, I would suggest you click on this Icon —>select the Product image URL dynamic content

Tesxproduct-Layout-Builder-Pro (4)

Or

  • Under preferences, enable the Dev Console.
  • Inspect an Image element and open the console
  • Look for image_source and enter {{dc:woocommerce:product_image}}

Hope it helps
Thanks

We have everything set as you indicated except for the product image SRC we use:

{{dc:post:featured_image_id size=“woocommerce_thumbnail”}}

When your example, {{dc:woocommerce:product_image}} is used it presents the full size product image, which is a bad practice for the archive pages because not only is the image file way too big but the images are also not using the neatly cropped version so it looks like a mess.

What’s the proper way to get the placeholder image to show while also utilizing proper practices for archive images?

Hello @co50,

In your Image element that uses {{dc:post:featured_image_id size="woocommerce_thumbnail"}}, you will have to add a condition that it will only display when the product has a featured image.

You will then have to add another Image element which will display the placeholder image. You also need to add a condition on this Image element and this time, it will only display when the product has no featured image.

Hope this makes sense.

OK, kinda hack-y but if that’s the only way to do it, I got it and thank you.

You are most welcome @co50

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.