Color Swatch – Not able to select & show preview

Hi Team,

I need the color swatches to function exactly like this -http://demo.xtemos.com/basel/shop/woman/jur-detail-jacket/

1) User being able to select a swatch – So in my case, although I have set them up correctly, the selection does not happen, even if you click a swatch. Something wrong here?

2) Next like your demo, I want that on clicking a swatch (example, yellow), the gallery image changes to yellow dress picture. This is not happening, even though I have used an Image upload for the attribute. Please advice.

Thanks a lot!

Regards,
Amit

Hello,

Could you please provide a link to the products with swatches you created so we could see why it is not working?

Link in private.

And give us your admin access also. Thanks

And you need to update the theme to the latest version also.

Hi, sent in private.

You can update the theme by replacing all theme files with new ones via FTP or just reupload theme zip file in Appearance -> Themes -> Add new. But you need to install the following plugin before https://wordpress.org/plugins/easy-theme-and-plugin-upgrades/

As for swatches so you need to edit your size terms in Products -> Attributes -> Size -> edit terms -> and check “Enable swatch” option for each size

Regards

Hi Team, Appreciate your quick responses!

I think I found the issue, but need your help in resolving it.
I am using this plugin called Product Add ons from Woo-commerce. https://woocommerce.com/products/product-add-ons/. This allows me to add custom product options, as seen. All is well when I use the checkboxes etc.(see first screenshot) – but when I add a select box it somehow interferes with the theme standard select option of attributes and throws an error. (See second screenshot attached- private).

Can you please suggest what could be done? Possibly some js inject? Thanks a lot!

Firstly, as we already wrote you, you need to update theme to the latest version since we have fixed some errors in the last update.

Hi Team, theme has been updated.
I am still seeing the issues as mentioned earlier.
Swatch selection is not working. It can be seen in the URL shared.
Screenshot was also shared earlier. FYI, the console shows error (theme.min.js?ver=4.6.1:11 Uncaught TypeError: Cannot read property ‘forEach’ of undefined)

Please advice,

Regards,
Amit

Now we see that problem comes from this additional plugin. Are you able to provide us your FTP access so we could try to fix it on your live web-site?

I will have to try and setup public ssh keys, as FTP does not work (Digital Ocean). Could you possibly debug from the console (or any other option possible) and see if you can point a fix? Let us know, if access is the only option, and then I will try to set up one. Thanks!

Try to edit file basel/js/functions.js and change the following line

$variation_form.find('select').each(function() {

to this

$variation_form.find('.variations select').each(function() {

Regards

Thanks!Will get back after testing.

Ok, write us about the results.

Thank you

Hi Team, it did indeed work! Thanks for your support. Very much appreciated.
However, we removed that plugin as it was causing some other issues also.

You are welcome, we are always happy to help you, write us when you have any difficulties or issues with our theme.

And we would be glad if you will rate our theme with 5 stars on themeforest in case you are satisfied with our theme and customer service http://themeforest.net/downloads

Thank you in advance 🙂

[Author]

Posts