why are product images not appearing? Refresh Theme

Solved

why are product images not appearing? Refresh Theme

MahmoudSalahat
Visitor
2 0 0

Hello, I need help please!!

My product images are not loading all of a sudden on my website.

Other images are fine, but just the product images are not loading and it just shows white space.

The product main images are not appearing, just the title of the product is appearing.

If I click on the title and go to the product description pages, all the images are shown.

This happens in the Product page only.

it normally worked just fine and problem suddenly happened, 

Also >> there is a white circle with a Arrow in this place ( product Images) .

my website is www.TheCarsTools.com.

Please Help Me!!!! Thank you..

Accepted Solution (1)

DrewOswald
Shopify Partner
10 6 4

This is an accepted solution.

Hello MahmoudSalahat, I looked into the code and it appears that the issue is these 2 sections on your product page

001.PNG002.PNG

The reason this is happening is because these two sections are importing a stylesheet that is using a class name to style those sections but that class name is already in use by your product media gallery. So these stylesheets are overwriting the styles used by your product media gallery causing it to not to show up. This is the specific style rule that is causing your images not to show:

003.PNG

I recommend either removing these sections or if you are comfortable with coding you can rename the classes on both the html and the css stylesheet, usually I just suffix the existing class names with a dash and number. For example: .slider -> .slider-12345

Need a developer? Send me a DM

View solution in original post

Replies 2 (2)

DrewOswald
Shopify Partner
10 6 4

This is an accepted solution.

Hello MahmoudSalahat, I looked into the code and it appears that the issue is these 2 sections on your product page

001.PNG002.PNG

The reason this is happening is because these two sections are importing a stylesheet that is using a class name to style those sections but that class name is already in use by your product media gallery. So these stylesheets are overwriting the styles used by your product media gallery causing it to not to show up. This is the specific style rule that is causing your images not to show:

003.PNG

I recommend either removing these sections or if you are comfortable with coding you can rename the classes on both the html and the css stylesheet, usually I just suffix the existing class names with a dash and number. For example: .slider -> .slider-12345

Need a developer? Send me a DM
MahmoudSalahat
Visitor
2 0 0

Thank You So Much My Friend its Correct.