Product images load with black background before loading product image

[jayjay5000]

Product images for every image on my shop, load as a black box, and then quickly switch to the product image,

Can any one help with this?

[rainstormstudio]

Hi @jayjay5000,

To fix this, you need to change the placeholder background color in your theme’s CSS files. Here’s how:

1. Go to Online Store > Themes > Edit code.

2. Open your theme’s base.css file (or sometimes component-card.css or theme.css, depending on your theme).

3. Search for a class like .global-media-settings, .product-media-container, or .loading.

4. Add or edit the background color property. For example, to make it white or transparent, add:

css

.global-media-settings, .product-media-container, .loading { background: white !important; background-color: white !important; }

Or use transparent if you prefer:

css

.global-media-settings, .product-media-container, .loading { background: transparent !important; }