Gallery conflict with Variation Swatches plugin

Sharon Baker

• June 21, 2022 14:23

I am building a store for a client. They prefer to use a variation swatches plugin. The trouble is, there is some kind of conflict between the Brizy product images gallery and the swatches plugin. 

The page will intermittently load one of two ways:

• With the gallery looking correctly styled, but clicking on a color swatch does not update the product image (The image should change to show the product in the selected color).

• Or, with the gallery looking broken and unstyled, and the swatches functioning properly. 

I have tried several different swatches plugins, as well as gallery styling plugins, with no success. Any fix or workaround would be appreciated.

0

• 

  KC George

  • June 22, 2022 07:20

  Hi Sharon,

  Can you please try this? Save the Brizy Single Product Template design as a layout so that you can import it later. Then delete the Brizy Single Product Template and check if the variation swatch plugin and product gallery works together well in the theme's single product page. This will help ensure that your woocommerce setup is complete. Once everything works fine with your theme, then add the Brizy Single Product Template again (from the saved layout)

  If everything works fine with your theme and does not work well when adding Brizy Template, we will take a look and see if we can make it work for you.  

  0
• 

  Sharon Baker

  • June 22, 2022 17:02

  That did the trick! Thank you so much for your help.

  0
• 

  Sharon Baker

  • June 23, 2022 16:07

  Spoke too soon. As of this morning, the gallery is styled properly, but clicking a swatch doesn't update the product variation image. Any other ideas?

  0
• 

  KC George

  • June 24, 2022 07:03

  Hi Sharon,

  If there is an incompatibility issue between Brizy and the variation swatch plugin and if the variation swatch is an important project requirement, you may need to consider using the default theme styling for your single product page. (and not use Brizy Product Template)

  To confirm if there is an incompatibility issue, you need to do the experiment I had suggested above. If you need help with this investigation, please add me as a user to your WordPress Dashboard. My email: kc.george@brizy.io. Please enable the option "Send the new user an email about their account" as in this screenshot https://jmp.sh/tSRznJX

  Once you have sent me an invitation, please let me know here.

  0
• 

  Sharon Baker

  • June 24, 2022 13:26

  I tried the test 2 days ago and it was working on the theme page, but later on it wasn't working there either. I would love to have your help in figuring this all out! I've added you as a user. Thank you!

  0
• 

  KC George

  • June 24, 2022 14:51

  Hi Sharon,

  I tried accessing your WordPress Dashboard.  I got an Access Denied message from the Cloudflare Firewall. https://jmp.sh/7b2arLW  This is the Ray ID: 72063b9d8c7a85d6

  You may need to do something in your Firewall to allow me access to your website. Please see this link https://support.cloudflare.com/hc/en-us/articles/360029779472-Troubleshooting-Cloudflare-1XXX-errors#error1020 

  0
• 

  Sharon Baker

  • June 26, 2022 18:22

  Please try again as I have just turned off all the country blocking within Cloudflare.

  Sharon Baker 

  0
• 

  KC George

  • June 27, 2022 14:15
  • Edited

  Hi Sharon,

  I spent sometime with your website. I can confirm these

  1. The Variation Swatches for WooCommerce plugin works well with your theme. When selecting different color swatches, corresponding product images are being shown in the gallery
  2. Woocommerce attributes and variations appear setup correctly
  3. Variation Swatches for WooCommerce does not seem to work well with Brizy
  4. Changed theme and deactivated plugins one by one to see if that would help; but did not.

  Indications are strong that there could be a conflict between Variation Swatches for WooCommerce and Brizy.  

  Please consider this work around. Since you have only two products, create a page for each product and display the products using the woocommerce shortcode. For example, please see the page https://mouthguardpro.com/kids-comfort-pro-mouthguard/ 

  To create this page,

  1. I have added the global header and footer 
  2. I have added Brizy shortcode element 
  3. I have pasted the code [product_page id="9303"]

  Similarly create another page for the 'Keeper Case' product by repeating the first two steps and pasting the shortcode [product_page id="7007"]

  In this approach, the Brizy Cart icon would not update. May be you can remove the cart icon and rest of the woocommerce pages should work well. 

  0

Please sign in to leave a comment.