I have one little issue, have 3 galleries, with only 3 images each. I’m using the Carousel with 400×400 images on that. Therefore the middle image is large and the other 2 are side by side smaller so easy for customers to scroll to the next image no issues. That is perfect.
This works and looks perfectly on large LCD screens. Straight away it gets to the sizing of 15″ laptop or 13″ laptop, as smaller screen, you can ONLY see the 1 main image and NOT the others ones side by side as small as per the Carousel. Therefore it looks pretty awful on smaller device.
Is there a setting to change here to allow it to view properly on smaller devices with Carousel version please? I can just make the images 250 width and height instead of 400 on larger devices.
But I assume I would need some css coding for this. Can you help please?
For the mobile & Ipad I just changed it to normal default gallery view for those devices to fix that issue for that and that is NO issue.
But I really want the same effect that I have on the PC, for the 15″ laptop and 13″ laptop. Please advise HOW I can CODE to see the gallery better with Carousel (3 images only) to allow it viewed properly on those devices ?
Site is going live in 1 day.
Any support would be greatly appreciated. I really love your plugin but need to fix this issue.
Thanks
Kristin
]]>It seems the native WooCommerce product gallery has set opacity to 0 until the scripts relevant to render it run, then it fadesIn. When I use scripts delay via your plugin, the gallery is not visible until someone interacts with the website. This is not expected and I’ve found that WP Rocket has a built-in solution.
I’ve tried to force opacity 1 to the gallery, but it looks bad, since the JS responsible for putting the html together and make a flexslider out of it is being delayed.
I’ve tried to exclude relevant scripts from being delayed, but it seems now they run too quick, so the slider doesn’t work either.
I’ve found that in WP Rocket they keep these 2 scripts from being delayed but keep the defer tag and it runs well this way.
I’m not sure this is the 100% fix for this problem, because I’m not able to test it. I don’t know how to exclude certains scripts from being delayed, but keep the defer tag present.
The relevant scripts to the gallery are:
/plugins/woocommerce/assets/js/frontend/single-product.min.js
/plugins/woocommerce/assets/js/flexslider/jquery.flexslider.min.js
Please help
I have a client website going live soon. It is a clothing website.
Each Product has COLOURS & SIZING options as variables …
Let’s say a Hoodie for now.
COLOURS: Yellow, Green, Blue, White, Black
SIZING: S, M, L, XL, XXL
Variables set in the backend are:
Yellow S
Yellow M
Yellow L
Yellow XL
Yellow XXL
Green S
Green M
Green L
Green Xl
Green XXL
Etc you get what I mean with the Variables Variations.
Every one of these have an IMAGE uploaded to each of those Variations relevant the COLOUR CHOSEN .
ON PRODUCT PAGE IT LOOKS LIKE THIS:
PRODUCT NAME – HOODIE
Short Description
PRICING
COLOURS AVAILABLE (which are colour swatches)
SIZING AVAILABLE (which are sizes available)
We are currently TESTING the site, and we are seeing the TESTERS are getting confused that they have to click on BOTH the COLOUR (AND) SIZING to see the actual Product HOODIE Colour Green style (the image
I get that as that is what is set in the Variable ..
We have STOCK Control of all the Colour & Sizing
Meaning Stock Control of GREEN Hoodie Size XL therefore that is WHY I had the Variable with COLOUR & Sizing together …
BUT then this is NOT clear for everyday customers if they click on the COLOUR – They would like to see what the HOODIE COLOUR looks like BEFORE even bothering having to click on the SIZING as well .
So HOW can I do a workaround for this issue ?
How can I achieve that the customer when clicking on COLOUR will see the COLOUR of the actual HOODIE & NOT have to click on SIZE as well BEFORE they see the actual product Colour ?
ALSO another question regarding same site, as I have a hover zoom set up on the Single Product Page for when people hover over on a PC or laptop, BUT on mobile devices they obviously cannot hover, they can put their finger on the image (but as I have set the image zoom on hover to high for PC), it doesn’t work on the mobile. How can I rectify this issue ? Can I change the link/hover/click on the Single Product Image for MOBILE ONLY ?
Is that achievable at all ?
Site is going live very soon, so hadn’t expected to have this issue.
Thanks in advance for reading.
Regards
Kristin
I have a website with lots of products that have variations. I wanted to disable the zoom function so I pasted the following code under: Appearance – Customise – Advanced – Custom CSS
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .zoomImg {display:none!important}
It seemed to disable the zoom, however, it appears that it has also removed my galleries. I am not 100% sure of this, as I did not notice it at the time so it could have been something else.
I have deleted the code now, but it appears that the changes have already been made and it’s not reversing anything.
The product image is showing, when I click on the colour variation, it switches to the linked colour image as well. It is only the gallery at the bottom that is missing.
Is there a simple way/code that I can paste to get the gallery displaying again?
As you might tell, I’m far from understanding the codes, I am only using themes, builders and plugins so any help would be appreciated.
Thanks in advance,
Robin
I have installed your plugin, but cannot see where to add Video LINK
I am using Divi Theme also.
There are no options to choose the video link that I can see in your plugin ?
I cannot see it on the Single Product page or in your plugin ?
I must be going blind ?
ALSO when I change the thumbnails to go on the Left side, they do not appear at all. They go strange (and below the image underneath each other) instead of to the left side.
They are fine on the bottom underneath the main image, but would prefer on left side.
Thanks Kristin
]]>Whats the best way or another plugin that I can use to CHANGE the Order in the Single Products Page.
I have variations in place, so when a customer chooses Red, then the image on the left will change to a Jumper that is red.
Currently I have Main images & Gallery on the left AND on the right is the Product Title, Price, Short Description, then the Colours available as swatches and the Sizing available as swatches.
I really need the swatches further up under the pricing as they are too far down. When client chooses the Red, then you CANNOT see the image changing on mobile because the image is too far up the page from where the swatches are, so I need to move then.
Thanks in advance
Regards
Kristin
I have used your plugin for many clients and have always loved it, simple installation and works always.
I have a client which we are using Divi Child theme purchased and your plugin creates the Image scrolling on TOP of the Single Product Page instead of replacing the existing.
Must be to do with the design of the Divi Child theme I purchased.
They have asked whether there is a shortcode to use instead so I can get it working ?
Thanks
Kristin
Is there a shortcode to use also ?
I am using a particular Divi Theme that I purchased and your plugin when activated is displayed on top of the Woocommerce Single Product page and NOT showing where it should be in the gallery section on left side of Single Product page.
The Divi Theme people have suggested I ask about a shortcode that I can use somehow ?
Thanks
Kristin
I’ve had your plugin working for years on my client site. The customer mentioned recently that it is NOT displaying the carousal/gallery slider for products in the Gallery anymore at all. All we see is the actual main product on the Customer side and NO gallery slider.
It is very odd as I haven’t made any changes AND haven’t updated any plugins recently. I deactivated the plugin and reactivated but didn’t make any difference. Current version is 2.0.4
If someone could help me urgently would be great on HOW to rectify this issue.
It is a live site so I have to get it working quickly.
Regards
Kristin