WooCommerce shortcode issue with Astra last version (3.7.9)

I could reproduce this issue with a local website (made with Local by flywheel)

I made my test on my test site with:
Wordpress 5.9
Astra 3.7.7
Woocommerce 6.2.1
Elementor 3.5.6

I created 2 products for WooCommerce and added a pictures for categories.
Then in Elementor I used a shortcode [product_categories]

And here are the results:
With Astra 3.7.7

PC
https://ibb.co/WxbNGZq

Mobile
https://ibb.co/3Bw4CvZ

With Astra 3.7.9

PC
https://ibb.co/mJ4QXv7

Mobile
https://ibb.co/3d3cCh9

Is there a way to address this issue to Astra?

I have the same issue, all the shortcode on my homepage always showing 4 products on mobile on 3.7.9, rollback to 3.7.7 fix the issue

I completely agree with you gentlemen! I don’t understand how you can release updates without testing everything for errors. For example, if you are finalizing the functionality for a particular plugin, then why not test it all at once!

At least I am not the only one to be concerned, I hope Astra will do something about it soon..

By the way, I made a new test, I can reproduce the issue on pages created with Astra, Elementor has no impact. I created a test page, add some WooCommerce shortcodes ([products] and [product_categories]) inside it and I could see the issue again..

• This reply was modified 2 years, 8 months ago by kureman.

These are defects in the shameful template! Since I did a rollback to the previous version and everything is fine. And until the developers fix this situation, I will not update.

The only thing I noticed in the developer panel is that mobile layout styles don’t connect.

A desktop layout is constantly involved:

@media (max-width: 921px)
.woocommerce.tablet-columns-3 ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

And in a good way , this one should be connected in the mobile version:

@media (max-width: 544px)
.woocommerce ul.products, .woocommerce-page ul.products, .woocommerce.mobile-columns-1 ul.products, .woocommerce-page.mobile-columns-1 ul.products {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

Put this on function.php

add_filter( ‘astra_apply_flex_based_css’, ‘__return_false’ );

• This reply was modified 2 years, 8 months ago by yoha03.

Hi @yoha03 ,

I sent a ticket to Astra and they send me this code too, I came back here to share it but you were faster ??
I tested it and it’s working perfectly, thanks

I mark this topic as resolved then.

Hello @kureman,
i have the same issue, could you please make a tutorial to solve that for the beginner that i am ?
Cheers

Hello @vardinoyanis,
Just paste this code snippet:

add_filter( ‘astra_apply_flex_based_css’, ‘__return_false’ );

to your template file function.php. After that, update the cache, and check!

Hello @Виктор
You mean in Theme editor/ Astra:Fonctions.php ?

• This reply was modified 2 years, 8 months ago by vardinoyanis.

Hello @Виктор
You mean in Theme editor/ Astra:Fonctions.php ?

That’s right @vardinoyanis!

@vardinoyanis! This method will work if you don’t have a child theme. If there is a child theme and it is activated, then this code must be inserted into it.

@kalidarn i can paste it on any line i want? it dosen’t matter?

@vardinoyanis! Paste at the very bottom of the file function.php