[Resolved] Upsell not working with Elementor & GeneratePress Pro

[Roger]

Elementor recently did an update to their Pro version and since that time my upsell items are not showing up properly. If I disable GeneratePress Pro the upsells show up properly with medium image sizes and title, price, and rating properly formatted. As soon Ias I reactivate GeneratePress Pro the formatting is gone. The columns are scrunched up displaying one word per line and the images are really small ( approx 16px in size).

Is there a way to correct this? As of now I have to leave GeneratePress Pro disabled so that the proper formatting is displayed.

[Tom]

Hi there,

Any chance you can activate GP Premium so I can inspect the issue closer?

Let me know 🙂

[Tom]

This looks like a bug in Elementor. It may be worth reporting it to them.

They have this CSS currently:

.woocommerce .elementor-element.elementor-wc-products ul.products li.product, 
.woocommerce div.product .elementor-element .related.products ul.products li.product {
    width: auto;
}

It’s missing a selector for upsells.

It should be this:

.woocommerce .elementor-element.elementor-wc-products ul.products li.product, 
.woocommerce div.product .elementor-element .related.products ul.products li.product, 
.woocommerce div.product .elementor-element .upsells ul.products li.product {
    width: auto;
}

For now, you can add this CSS to fix it:

.woocommerce div.product .elementor-element .upsells ul.products li.product {
    width: auto;
}

[Roger]

Thanks for the quick resolution to the problem. I implemented the CSS snippet you offered as a quick fix in my Single Product Template. It worked.

I also opened a ticket with Elementor about the missing selector in their CSS code so that they can provide an update to fix the problem.

Again, thanks for your very quick help.

[Tom]

You’re very welcome! 🙂

[Author]

Posts