Theme issue when product variations/attributes set in woocommerce?

Shapely
1

Hello,
I have a fresh install of wordpress and woocommerce. I started setting up a shop and some products. When a product has variations/attributes the main product image and gallery do not display. If I change the theme back to 2016 things work fine.

You can see this in action here:
http://208.86.154.190/~heimieshab/index.php/product/the-aviator/

There are two products in the shop. One has variations, the other does not. The one without variations displays just fine.

This is a link to the product without variations.
http://208.86.154.190/~heimieshab/index.php/product/roll-top-pack/

Thanks for your help.

2

Hi @pierrebalian,

I hope you are well today and thank you for your question.

You can try resolving this issue by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

#main .product.has-default-attributes.has-children>.images {
    opacity: 1;
}

Best Regards,
Movin

3

Hey, having a similar issue with product variations, the image for the product variations don’t update on the product page as they do with other themes. I’m using Colorlib Shapely theme for WP. Each product has many variations with custom images for each. Tried the CSS code above to no avail. Please advise.

4

Hey Solon,

I had the same issue as well.

From what I recall it was a js conflict/error with the flexslider installed with the theme.

If you look at your web inspector console there is a flexslider error:
Uncaught TypeError: $(…).flexslider is not a function shapely-scripts.js?ver=20160115:139

I am not using the inbuilt slider, so I just removed that from the /js/shapely-scripts.js file

In my file this was from line 138 to 183

5

I would post the code to remove, but Securi Cloud Firewall keeps blocking it.

6
If you look at your web inspector console there is a flexslider error: Uncaught TypeError: $(…).flexslider is not a function shapely-scripts.js?ver=20160115:139

If you are getting this error message then to resolve it try using the latest version of Shapely theme by downloading it from GitHub - ColorlibHQ/shapely: Free multipurpose WordPress theme built using Bootstrap

7

Im not sure if this is the problem im having. I haven’t seen any error messages on WP and my shapely theme is updated. Any ideas?

8

Again, Variable Product images are not appearing once the user has selected the relevant choices via the drop down menus using woo commerce. What can i do to resolve this, im using the shapely theme.

9

@solon Could you please share me the page URL from your site where it is happening so that i can troubleshoot it?

10

http://gizbros.com/product/ares-class-bundle-pack/

11

@solon It seems this is happening on your site due to javascript error message occurred on your site as shown in the attached screenshot.

To resolve this issue could you please use latest version of Shapely theme by downloading it from the following page.