Display attributes for simple products on the archive page

Hello @Eragon,

We have temporarily modified one of your simple products: https://gyazo.com/d3a0fd399aba1291a427089ecde124a0. On the product archive, the attributes are now displayed in the same way as for other products: https://gyazo.com/f012bc9c71af68363d600125fa6ad81f.

Could you please clarify the result you would like to achieve? Screenshots or live examples would be very helpful for our understanding.

If you would like to have the static attributes shown on simple products you can use next custom CSS in Theme Options -> Theme Custom CSS:

.product-type-simple .etheme-product-grid-fadeIn-area {
    opacity: 1;
    visibility: visible;
    z-index: 3;
}

.product-type-simple.etheme-product-has-fadeIn-content {
    box-shadow: none !important;
    overflow: visible !important;
    z-index: 3;
}

.product-type-simple.etheme-product-has-fadeIn-content .etheme-product-grid-spacer {
    opacity: 1;
    visibility: visible;
    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.5);
}

Best regards,
Jack Richardson
The 8Theme’s Team

Hello @Eragon,

We have identified the issue. Please note that the calculation of the correct attribute section height is set only on the first mouse hover. Unfortunately, this means there is no fully accurate solution for your case using CSS snippets.

As a workaround, you may try adding the following CSS code and check the result:

.product-type-simple.etheme-product-has-fadeIn-content .etheme-product-grid-spacer:not([style]) {  
    height: calc(100% + 100px);  
}

or next CSS:

.product-type-simple.etheme-product-has-fadeIn-content .etheme-product-grid-spacer:not([style]) {  
    height: 490px;  
}

Best regards,
Jack Richardson
The 8Theme’s Team