-
Hi,
I have two online shops running woocommerce, both with generatepress and WPRocket and cloudflare. I recently activated the plugin “Product Video Gallery for Woocommerce” to both sites.
I initially had problems on both sites with some spacing (between photo and text) and also that the product thumbnails would flash a full sizes video image (when there was a video link attached) or a full sized image of the the first thumbnail (when there was no video attached)
I talked to the developer and he gave me some CSS to fix the spacing (which worked) and a second for the thumbnails (below).images.nickx_product_images_with_video.loading {
max-height: 455px !important;
overflow: hidden !important;
}This seemed to fix the thumbnail issue on one of the sites – https://www.aaronbrownsculpture.com
but not the second – https://acarvedpiece.co.nzThis is a link to a product with a video attached – https://acarvedpiece.co.nz/product/pounamu-pekapeka-bat-2/
WP rocket has the same settings on both sites. I’ve also disabled wprocket and gone through the other plugins that I think could affect it but can’t find a solution,
Any ideas?
Thanks in advance
Aaron -
Hi Aaron,
For reference, can you share a link to a Product page at https://www.aaronbrownsculpture.com that has a video? I’ll see how the code runs and assess how to apply it to your second site.
-
Hi Fernando,
Here you go https://www.aaronbrownsculpture.com/product/two-fantails-silver-ring/
Thank you
Aaron -
I see. That’s weird, you’re CSS doesn’t seem to do anything on that page.
In any case, can you try adding this CSS for the second site?:
.single-product square-placement { min-height: 38px; }Then, enable WP Rocket and defer Render Block scripts.
-
Hi
Done, just to double check in Rocket I’ve ticked “Load Javascript Deferred”
Thanks -
Where did you add the CSS I provided? I’m not seeing it on the site.
-
Hey,
I added this through the front end – Customize then Additional CSSsite – A Carved Piece right?
-
Yes, that’s the site I’m looking at but the CSS is not showing.
I can see it though if I view the site with
?wprocket=1.Have you tried using a CDN to serve your site’s resources faster? Helpful link: https://www.wpbeginner.com/showcase/best-wordpress-cdn-services/
-
ah,
Could another setting be blocking it?
I’ve taken it out of additional css and put it into plugin called simple custom css
Can you see it now?
I already use cloudflare
thanks
Aaron -
Let’s try to address to loading speed of your site’s resources. You can remove the CSS I provided. It may be irrelevant.
Have you tried using a CDN to serve your site’s resources faster? Helpful link: https://www.wpbeginner.com/showcase/best-wordpress-cdn-services/
-
ok cool,
I already use a cloudflare CDNIs it working properly?
thanks
-
It seems to be working fine but something seems to be render blocking. Are aaronbrownsculpture and acarvedpiece both hosted on the same server?
What optimization plugins are you using for both? Can you check if they have the same settings?
-
They are both on the same server,
I’ll see if I can find anything,
thanks -
Yes. Checking would be good.
It seems it may have something to do with the loading time of resources as opposed to this CSS of yours not working:
.images.nickx_product_images_with_video.loading { max-height: 455px !important; overflow: hidden !important; }But, you can also try removing this CSS for your first site to test if it’s really the one fixing the issue.
-
All I have is wp rocket and lazy load (by wprocket)
The same settings on both sites.Would it help if I gave you some temp login details?
-
“But, you can also try removing this CSS for your first site to test if it’s really the one fixing the issue.”
ok will do
- You must be logged in to reply to this topic.