Mobile Product Gallery Issue with Variable Products after WooCommerce Update

automondo

Hello Betheme Support,

I am experiencing a problem with the product gallery on mobile devices, but only for variable WooCommerce products.

Description

When the product page loads, the main product image is displayed correctly for about one second. Immediately afterwards, the gallery is reinitialized and the image becomes much larger than the viewport, so that part of the product is cut off.

This issue only affects variable products. Simple products are displayed correctly.

Technical observations

• The problem occurs only on mobile devices.
• The image is initially displayed correctly and then changes automatically.
• It looks like the WooCommerce/Flexslider gallery is recalculating the width incorrectly after JavaScript initialization.
• In the browser console:
  • .flex-viewport width is approximately 653px.
  • .woocommerce-product-gallery__wrapper width becomes approximately 9142px (7 gallery images).

This causes the first image to overflow and display at the wrong size.

Environment

• Latest Betheme version
• Latest WooCommerce version (10.2.x)
• WordPress latest version
• The issue appeared recently and seems related to the gallery initialization on variable products.

Could you please check whether this is a known compatibility issue between Betheme and the latest WooCommerce product gallery, and if there is a recommended fix?

Thank you very much for your support.

Best regards,

Roland Locher

klangei-shop.ch