I can’t select the color variants or add the product to the cart

  • Resolved gianlucapantaleo

    (@gianlucapantaleo)


    3 weeks, 1 day ago

    Hello, not always but sometimes and not on all browser/os I can’t select color variation in frontend, they does not keep selected. If you refresh the page 2 or 3 times than it works sometimes, sometimes not, expecially on Chrome MacOS and Safari iPhone. I face the issue myself and some of our customers. Any suggestion, please? Thanks. Here a screencast:
    https://www.loom.com/share/b55fec2bae2c4c0d916986d9261eb0a4?sid=bab071fe-b6ef-4a12-8621-bb09544401cc

    System Status Report

    ### WordPress Environment ###

WordPress address (URL): [Redacted]
Site address (URL): [Redacted]
WC Version: 9.3.3
Legacy REST API Package Version: Il plugin API REST legacy non è installato in questo sito.
Action Scheduler Version: ? 3.8.1
Log Directory Writable: ?
WP Version: 6.6.2
WP Multisite: –
WP Memory Limit: 768 MB
WP Debug Mode: –
WP Cron: ?
Language: it_IT
External object cache: ?

### Server Environment ###

Server Info: Apache
PHP Version: 8.0.30
PHP Post Max Size: 256 MB
PHP Time Limit: 120
PHP Max Input Vars: 3000
cURL Version: 8.2.1
OpenSSL/3.1.4

SUHOSIN Installed: –
MySQL Version: 8.0.36-28
Max Upload Size: 256 MB
Default Timezone is UTC: ?
fsockopen/cURL: ?
SoapClient: ?
DOMDocument: ?
GZip: ?
Multibyte String: ?
Remote Post: ?
Remote Get: ?

### Database ###

[REDACTED]

### Post Type Counts ###

attachment: 871
awl-labels: 2
csp_rules: 2
custom_css: 2
customize_changeset: 1
dflip: 1
elementor_library: 4
elementor_snippet: 4
et_body_layout: 9
et_footer_layout: 9
et_header_layout: 9
et_pb_layout: 8
et_template: 33
et_theme_builder: 1
fgf_master_log: 31
fgf_rules: 4
ghost-sliders: 9
itsec-dash-card: 8
itsec-dashboard: 1
jet-engine: 2
nav_menu_item: 78
page: 33
popup: 4
popup_theme: 8
post: 5
product: 155
product_variation: 424
revision: 100
robo_gallery_table: 1
shop_coupon: 24
shop_order: 1565
shop_order_refund: 9
wacv_email_template: 3
wapf_product: 1
wp_global_styles: 1
wp_navigation: 1
wp_template: 2
wpcf7_contact_form: 4
wpcf7r_action: 2
wpcode: 3

### Security ###

Secure connection (HTTPS): ?
Hide errors from visitors: ?

### Active Plugins (50) ###

3D FlipBook : Dflip Lite: di DearHive – 2.3.42
Advanced Woo Labels: di ILLID – 2.05
Advanced Woo Search: di ILLID – 3.19
Akeeba Backup CORE for WordPress: di Akeeba Ltd – 8.2.7
Better Search Replace: di WP Engine – 1.4.7
Solid Security Basic: di SolidWP – 9.3.3
Bulky - Bulk Edit Products for WooCommerce: di VillaTheme – 1.2.7
Nexi XPay: di Nexi SpA – 7.3.4
Contact Form 7: di Takayuki Miyoshi – 5.9.8
Contact Form CFDB7: di Arshid – 1.2.9
Duplica pagina: di mndpsingh287 – 4.5.4
GTM4WP - A Google Tag Manager (GTM) plugin for WordPress: di Thomas Geiger – 1.20.2
Elementor Pro: di Elementor.com – 3.25.0
Elementor: di Elementor.com – 3.25.3
Free Gifts for WooCommerce: di Flintop – 11.6.0
Header Footer Code Manager: di DraftPress – 1.1.39
WPCode Lite: di WPCode – 2.2.3
iubenda | All-in-one Compliance for GDPR / CCPA Cookie Consent + more: di iubenda – 3.11.1
JetEngine: di ??????? ????? – 3.5.7
Loco Translate: di Tim Whitlock – 2.6.11
Members: di MemberPress – 3.2.10
Menu Cart Module Divi: di learnhowwp.com – 1.2
PixelYourSite: di PixelYourSite – 10.0.0
Popup Maker: di Popup Maker – 1.20.2
Popups for Divi: di divimode.com – 3.0.5
Redirection: di John Godley – 5.5.0
Role Based Pricing for WooCommerce: di Addify – 2.1.1
Speed Optimizer: di SiteGround – 7.6.8
Super Store Finder WordPress: di Joe Iz – 7.0
Ultimate Addons for Contact Form 7: di Themefic – 3.4.8
Variation Swatches for WooCommerce: di AovUp – 2.2.2
CTX Feed: di WebAppick – 6.5.30
Abandoned Cart Recovery for WooCommerce: di VillaTheme – 1.1.6
Checkout Field Editor for WooCommerce: di ThemeHigh – 2.0.4
Advanced Order Export For WooCommerce: di AlgolPlus – 3.5.5
WooCommerce.com Update Manager: di Automattic – 1.0.3
Additional Variation Images Gallery for WooCommerce - Pro: di Emran Ahmed – 1.3.25
Additional Variation Images Gallery for WooCommerce: di Emran Ahmed – 1.3.25
WooCommerce Abandoned Cart Recovery Premium: di VillaTheme – 1.1.3
Store Exporter for WooCommerce: di Visser Labs – 2.7.3
WooCommerce PayPal Payments: di WooCommerce – 2.9.3
WooCommerce: di Automattic – 9.3.3
Woosuite Core: di Woosuite – 1.1.3
Yoast SEO: di Team Yoast – 23.7
Redirection for Contact Form 7: di Themeisle – 3.1.8
Smart Coupons For WooCommerce Coupons: di WebToffee – 1.8.3
Sequential Order Numbers for WooCommerce: di WebToffee – 1.6.6
Tab prodotto personalizzato per WooCommerce: di Code Parrots – 1.8.5
YITH WooCommerce Product Bundles Premium: di YITH – 2.11.0
YITH WooCommerce Wishlist: di YITH – 4.0.1

### Inactive Plugins (7) ###

Google for WooCommerce: di WooCommerce – 2.8.6
Klaviyo: di Klaviyo
Inc. – 3.4.1

Mailchimp for WooCommerce: di Mailchimp – 4.4.1
Variation Swatches Pro: di Woosuite – 1.0.5
Wordfence Security: di Wordfence – 7.11.7
WP 2FA - Two-factor authentication for WordPress: di Melapress – 2.8.0
WP Rocket: di WP Media – 3.17.0.2

### Dropin Plugins () ###

object-cache.php: Memcached

### Must Use Plugins (2) ###

akeeba-backup-coreupdate.php: di  –
Elementor Safe Mode: di Elementor.com – 1.0.0

### Settings ###

Legacy API Enabled: –
Force SSL: –
Currency: EUR (€)
Currency Position: left_space
Thousand Separator: ,
Decimal Separator: .
Number of Decimals: 2
Taxonomies: Product Types: bundle (bundle)
bundled (bundled)
external (external)
grouped (grouped)
simple (simple)
variable (variable)
woosb (woosb)
yith_bundle (yith_bundle)

Taxonomies: Product Visibility: exclude-from-catalog (exclude-from-catalog)
exclude-from-search (exclude-from-search)
featured (featured)
outofstock (outofstock)
rated-1 (rated-1)
rated-2 (rated-2)
rated-3 (rated-3)
rated-4 (rated-4)
rated-5 (rated-5)

Connected to WooCommerce.com: ?
Enforce Approved Product Download Directories: –
HPOS feature enabled: –
Order datastore: WC_Order_Data_Store_CPT
HPOS data sync enabled: –

### Logging ###

Enabled: ?
Handler: Automattic\WooCommerce\Internal\Admin\Logging\LogHandlerFileV2
Retention period: 30 giorni
Level threshold: –
Log directory size: 52 MB

### WC Pages ###

Shop base: #76 - /negozio/
Carrello: ? La pagina non contiene lo shortcode [woocommerce_cart] o il blocco woocommerce/cart.
Pagamento: ? La pagina non contiene lo shortcode [woocommerce_checkout] o il blocco woocommerce/checkout.
Il mio account: #79 - /mio-account/
Termini e condizioni: ? La pagina non è impostata

### Theme ###

Name: Divi Child
Version: 1.0.2.9
Author URL: https://www.elegantthemes.com
Child Theme: ?
Parent Theme Name: Divi
Parent Theme Version: 4.27.2
Parent Theme Author URL: https://www.elegantthemes.com
WooCommerce Support: ?

### Templates ###

Overrides: divi-child/woocommerce/cart/cart-totals.php
divi-child/woocommerce/content-single-product.php
/home/customer/www/alika-cosmetics.com/public_html/wp-content/plugins/woo-variation-gallery/templates/product-images.php
/home/customer/www/alika-cosmetics.com/public_html/wp-content/plugins/woo-variation-gallery/templates/product-thumbnails.php


### WooCommerce PayPal Payments ###

Onboarded: ?
Shop country code: SM
WooCommerce currency supported: ?
Advanced Card Processing available in country: –
Pay Later messaging available in country: –
Webhook status: ?
PayPal Vault enabled: –
ACDC Vault enabled: –
Logging enabled: –
Reference Transactions: –
Used PayPal Checkout plugin: ?
Subscriptions Mode: Disabled
PayPal Shipping Callback: –
Apple Pay: –
Google Pay: –
Fastlane: –

### Admin ###

Enabled Features: activity-panels
analytics
product-block-editor
coupons
core-profiler
customize-store
customer-effort-score-tracks
import-products-task
experimental-fashion-sample-products
shipping-smart-defaults
shipping-setting-tour
homescreen
marketing
mobile-app-banner
navigation
onboarding
onboarding-tasks
pattern-toolkit-full-composability
product-custom-fields
remote-inbox-notifications
remote-free-extensions
payment-gateway-suggestions
printful
shipping-label-banner
subscriptions
store-alerts
transient-notices
woo-mobile-welcome
wc-pay-promotion
wc-pay-welcome-page
launch-your-store

Disabled Features: experimental-blocks
minified-js
product-pre-publish-modal
settings
async-product-editor-category-field
product-editor-template-system
blueprint
reactify-classic-payments-settings

Daily Cron: ? Next scheduled: 2024-10-30 12:13:18 +01:00
Options: ?
Notes: 40
Onboarding: completed

### Action Scheduler ###

Completato: 1.236
Oldest: 2024-09-29 17:17:05 +0200
Newest: 2024-10-30 10:49:52 +0100

Operazione non riuscita: 1.832
Oldest: 2023-08-07 15:24:18 +0200
Newest: 2024-10-30 04:10:40 +0100

In attesa: 2
Oldest: 2024-10-30 17:44:15 +0100
Newest: 2024-10-31 04:00:00 +0100


### Templates ###

Extended logging mode for Store Exporter Deluxe: ?Inactive Turn on Logging mode
Debugging mode for Store Exporter Deluxe: ?Inactive Turn on Debugging mode
Scheduled Export to FTP: ?
Scheduled Export to SFTP: ? The required SFTP functions are not available; ssh2_connect()
ssh2_auth_password()
ssh2_sftp(). Contact your hosting provider.


### Status report information ###

Generated at: 2024-10-30 11:06:38 +01:00

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Support Beauty of Code (woo-hc)

    (@beautyofcode)

    Hey @gianlucapantaleo ,

    The issue you’re experiencing with variation selections not staying selected sounds like it could be due to a conflict with a plugin or the custom templates in use, especially since it’s affecting specific browsers and devices.

    The following plugins stand out in the System Status Report, as they direct target the variations:

    Variation Swatches for WooCommerce: di AovUp – 2.2.2
    Additional Variation Images Gallery for WooCommerce - Pro: di Emran Ahmed – 1.3.25

    If you temporarily disable those 2 plugins, does that resolve the issue? If not, it also looks like the current theme on the site overrides the default single product page and images:

    divi-child/woocommerce/content-single-product.php
    /home/customer/www/alika-cosmetics.com/public_html/wp-content/plugins/woo-variation-gallery/templates/product-images.php
    /home/customer/www/alika-cosmetics.com/public_html/wp-content/plugins/woo-variation-gallery/templates/product-thumbnails.php

    Can you try temporarily switching to a default theme, like Storefront, and see if this resolves the issue?

    Please let us know how this goes!

    Thread Starter gianlucapantaleo

    (@gianlucapantaleo)

    Hi, here my tests:

    TEST 1: it works, I lose the colored squared instead of select, but it works
    [disabled] Variation Swatches for WooCommerce: di AovUp
    [enabled] Additional Variation Images Gallery for WooCommerce – Pro: di Emran Ahmed
    [enabled] Divi Child

    TEST 2: not works
    [enabled] Variation Swatches for WooCommerce: di AovUp
    [disabled] Additional Variation Images Gallery for WooCommerce – Pro: di Emran Ahmed
    [enabled] Divi Child

    TEST 3: not works
    [enabled] Variation Swatches for WooCommerce: di AovUp
    [enabled] Additional Variation Images Gallery for WooCommerce – Pro: di Emran Ahmed
    [disabled] Divi Child and enabled Storefront

    TEST 4: not works
    [enabled] Variation Swatches for WooCommerce: di AovUp
    [disabled] Additional Variation Images Gallery for WooCommerce – Pro: di Emran Ahmed
    [disabled] Divi Child and enabled Storefront

    So i think “Variation Swatches for WooCommerce: di AovUp” is the problem but I already wrote to their support before writing here, gave them a staging copy and website’s access and they told me: “It is working completely fine on our side. We have tested it multiple times and on different devices.? I am sorry but we cannot help until we see the error.? Moreover, this isn’t a feature of our plugin. It comes with the WooCommerce plugin itself.? Our plugin only allows you to create variation swatches alongside other features. Also, the API issue you are facing is because of an old version of the core plugin but it has nothing to do with the functioning of the Variation Swatches plugin.”

    Thread Starter gianlucapantaleo

    (@gianlucapantaleo)

    Than I made another test: I enabled the option in Variation Swatches for WooCommerce: di AovUp plugin’s settings called:
    “Disable Default Plugin Stylesheet -Option to enable/disable default plugin stylesheet for theme developer”

    enabling this I can see both squared color and select, If I click on the squared color id doesn’t works, If I use the select it work.

    https://www.loom.com/share/4277e06fa5ef4fafa46cb4f7c7eb96eb?sid=87d1abf2-9b91-4e07-9e5c-42d51338c622

    Plugin Support shahzeen(woo-hc)

    (@shahzeenfarooq)

    Hi there!

    Thank you for your detailed testing notes and the video link—this helps clarify the issue. From your test it’s clearly appearing as the issue is related to the Variation Swatches for WooCommerce: di AovUp plugin. I can see you mention plugin support member informed they are not able to replicate the issue on staging site.

    Just to verify the staging site you shared with the plugin provider, are you able to replicate the issue on that site with that plugin enable? or you are also not able to replicate the issue on staging site even if plugin is enabled?

    In the meantime, I would suggest you shared your test result with the plugin provider too and ask why issue is appearing in live site with that plugin enable and disabling that plugin fixes the issue.

    Additionally, could you please confirm were all the other plugins disable when you run those test? If the all order plugins were enable could you please run two more test. first with enable just Variation Swatches for WooCommerce: di AovUp + woocommerce plugin and child theme and test two with enable storefront theme + woocommerce and Variation Swatches for WooCommerce: di AovUp plugin

    let me know how that goes.

    Thread Starter gianlucapantaleo

    (@gianlucapantaleo)

    Yes, the issue is also replicable on the staging site. I have already shared the test results with the plugin provider, but they keep responding with: “We tested it again on a different browser and it seems to be working fine.”

    I have conducted the two tests you suggested (Test 1 and Test 2) while keeping the “YITH WooCommerce Product Bundles Premium” plugin active. This is necessary because the color swatches do not display otherwise, as the product causing the error is a Bundle. In both tests, the issue still occurs—though not consistently. Sometimes it works after refreshing the page two or three times, but then it fails again after further refreshes. This inconsistency is puzzling, and I’m not sure why the functionality changes upon multiple reloads.

    Please let me know if there’s anything else you’d recommend testing.

    Plugin Support EastOfWest a11n

    (@eastofwest)

    Hi @gianlucapantaleo, this sounds like a frustrating experience for you. Unfortunately we’re not able to troubleshoot plugins that are not ours, so this is as much as we can help. The functionality you’re struggling with is not core WooCommerce functionality, and thus outside our scope of support.

    Because of that, I’m going to close this thread, but before I do, here are some final suggestions:

    1. On your staging site, deativate all the plugins you do not need. It sounds like that would everything but WooCommerce, Variation Swatches for WooCommerce: di AovUp, and YITH WooCommerce Product Bundles Premium.
    2. Also switch your theme out to a standard one, like Storefront Theme, or Twenty Twenty Four.
    3. Test again. Does the issue still happen?
    4. If yes, also disable YITH WooCommerce Product Bundles Premium.
    5. Test again (on a Simple product). Does the issue still happen?
    6. If yes, make detailed notes for Variation Swatches for WooCommerce: di AovUp.
    7. If no, make details note for both YITH WooCommerce Product Bundles Premium and Variation Swatches for WooCommerce: di AovUp, because it seems that if both are active on a bundled product, they no long work together.

    If you can help the developers recreate the issue exactly and reliably, then they can investigate why the issue happens, and hopefully help you with a solution.

    If they cannot, it’s time to consider other plugins:

    From the WooCommerce marketplace that offer products we can support, I can recommend Variation Swatches and Photos for WooCommerce and Product Bundles for WooCommerce. To be sure, I tested them on my staging site with a product that looks similar to what I can see in your screenshots. They work in unison. Of course, you’ll need to test them with your theme, all your other plugins, and your particular product configuration to ensure they can continue working, but it looks promosing:

    If you need help with the suggested plugins, you can also open a support request via your WooCommerce.com account’s Get support tab. If you need help with anything else, please feel free to start a new thread.

Viewing 6 replies - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.