Few important issues

Hello there,

First, I’d like to thank you for your theme and support.

I have a few issues to raise:

1. Grid swatch attributes loading
I have ran many tests to understand while my shop pages were slow at loading while I optimized everything as explained in your documentation (WP Rocket settings, optimized images, Cloudways hosting…etc) and I found the main problem. When enabling Grid swatch attribute on shop pages, it loads all variant images which make the loading time crazy huge ( around 10 seconds Waiting TTFB), and even worse with a “loading more” button or infinite scrolling as those additional products are not cacheable. When I deactivate the grid swatch attributes, loading time goes from around 10 sec to <1 sec!

Is there any way to keep the grid swatch attributes without loading the attributes images and only load them when visitors click on the swatch?

2. Product page & Attribute (images)
On a product page with one colour attribute, everything works well as in your demo website: selecting a swatch will show the variant image while keeping the other images from the gallery available (Screenshot 1)
The problem comes with a combination of attributes . In that case, only the variant image is shown and all other gallery images disappear. (see screenshot 2 & Screenshot 3)

How can we avoid that please and keep the other image displayed?

3. Product page & Attribute (unavailable products)
In the same situation (product with combination of attributes), all combinations are displayed while some do not exist. For example (see screenshot 4), the ring shows 3 attributes ( Thickness, Color and size). Thick variant in grey does not exist in size 49 while thin variant exists in 49. When visitor selects Thick (Epais) + Grey, size 49 is displayed as available but when the visitor selects it, it shows a warning message saying that it does not exist and that he should try another combination. But how can he know which combinations exist if it is not greyed out? Visitors won’t try every combination to see if one is finally working. They will leave the website with a terrible experience.

Would you please have a solution to grey out non existing combinations when selecting attributes? This is what shopify does natively ( see screenshot 5)

Thank you for your help

Attachments:

You must be logged in to view attached files.

Hello,

1. The image of the variation is loaded as a background for the swatch itself. If you want, you can disable this option in Theme Settings -> Shop -> Attribute swatches -> Use images from product variations

2. Please, send us your admin access so we can check what is wrong with this functionality.

3. This functionality comes with the WooCommerce plugin and we can’t change this. You can switch to the default dropdowns and see that all variations also appear there so our theme doesn’t affect this.

Kind Regards

Hello,

Thank you for your answers.

1. I don’t think you understood what I meant. Your solution only changes the display of the small attribute swatches on the shop page. My problem is not here. The huge loading time comes from all variant images loaded in the background to make them available when visitors clicks on the attribute swatches. Will it be possible to not charge all those variant images at page start but rather when visitors clicks on the swatch (a bit like a lazy loading/ajax functionality)?

2. Please find admin access in the private part below.

3. Ok, noted

4. An additional question please, still related to attribute swatch on the shop page
Which variant image is showed when clicking on the attribute?
In the screenshot 1 attached, you’ll see a product with multiple attributes combinations. When you click on the gold attribute, it does not show a variant image but rather the default product image. it seems to be related to the fact that some gold combinations (Thick band + Gold) do not have variant images even if other gold combinations (Thin band + Gold) have specific variant images.

Can you please tell me which variant is used to show the image on the shop page ?

Thank you

Attachments:

You must be logged in to view attached files.

1. They will not be loaded if you disable this option. Please, keep it turned off and send us a link to the page where we can check this.

2. Strange, but we don’t see this problem now https://gyazo.com/ff562145031f0a69abbce003df40a28a

4. It just takes the first variation based on this color. So, anyway, you need to make sure that all variations have images uploaded to make it work.

Kind Regards

1. It is already off. Please look at this page for exemple: https://woocommerce-732462-2504116.cloudwaysapps.com/categorie/femme/

When grid swatch attribute is active: TTFB >10s (screenshot 1)
When grid swatch attribute is inactive: TTFB <1s (screenshot 2)

Attachments:

You must be logged in to view attached files.

Note that you have images for swatches set in Products -> Attributes -> edit terms. They are also loaded as background for the swatches themselves. https://gyazo.com/b72b272ea045c5a063253b7f972471e6

I am not sure to understand your solution.
Please correct the settings in the backoffice to allow grid swatch display on shop pages while keeping a TTFB <1s.
Thank you

We don’t see any problems related to grid swatches now. Please, disable all external plugins temporarily so we can check the TTFB.

Done, all external plugins have been disabled.
Grid swatch is active on shop pages and TTFB is btw 6 and 12 seconds according to the category/shop page.

Please, send us your FTP access so we can check what is wrong.

Also, we found that you have disabled cache mechanism for swatches in the child theme https://prnt.sc/F8Lt_G9t2See

1. Cache mechanism for swatches is disables on your recommendations due to another issue: see here: https://xtemos.com/forums/topic/attribute-swatches-not-always-showing-on-archive-pages/

2. Please find FTP info in the private part

Try to remove this code and let us know if it doesn’t work well for you.

Thank you, it seems to be better now.

OK, feel free to create a new topic when you will see any problems with this cache mechanism

[Author]

Posts