A user reports that the main product image is not displaying on mobile devices, only thumbnail images appear. The issue is specific to mobile phones—desktop displays work correctly without errors.
A solution has been provided involving CSS modifications:
#slide--main .slick-slide { opacity: 1 !important; }) at the bottom of the fileThe problem appears to be a CSS opacity issue affecting the product page slider on mobile views. Screenshots were shared showing both the mobile display problem and the desktop version working properly.
My problem is that the main product image not showing and only thumbnail images are showing just like how it looks down in the screenshot I attached
This is the theme that I am using.
#Note image on Desktop devices are showing and no errors, but only on mobile phones this problem appears.
This my website URL: tekniservices.com
Hello @tekni_services
You can add code by following these steps to show image in mobile view for product page slider
Go to Online Store → Theme → Edit code.
Open your vendor.css theme file
Paste the below code at the bottom of vendor.css
#slide–main .slick-slide {
opacity: 1 !important;
}
