- This topic has 15 replies, 3 voices, and was last updated 3 months, 4 weeks ago by Tom.
May 27, 2020 at 2:27 am #1303183Umesh
I have installed wp rocket and when I turn on the Critical CSS option it turns up like this on mobile
And this happens on most of the pages/products where woocommerce is used.
I am using critical CSS function with generatepress with success on others site, but this issue with my this site
* tried with the server, browser, wp rocket cache clear.
* tried with disabling every pluginMay 27, 2020 at 4:11 am #1303259DavidStaffCustomer SupportMay 27, 2020 at 5:18 am #1303311Umesh
I am talking with wp rocket too regarding this topic, waiting for their reply…
This happen only on those pages/products where woocommerce is getting used, rest simply “about” and “how to buy” pages are working fine.May 27, 2020 at 5:38 am #1303333DavidStaffCustomer Support
When WP Rocket is combing all of the various CSS files it is messing up the CSS order.
They will need to provide a fix or be able to tell you how to exclude files from being included within that.May 27, 2020 at 5:44 am #1303342Umesh
okay, what if I do not combine CSS and JS.
Thanks for your prompt replyMay 27, 2020 at 7:17 am #1303446DavidStaffCustomer SupportMay 28, 2020 at 6:41 am #1304925Umesh
Kieran from WP Rocket here, thanks for contacting support.
The Optimize CSS Delivery option doesn’t work for every site due to infinite possibilities of themes, plugins and custom code. If you’re experiencing an issue with this then I would recommend checking this support article: Critical CSS issues and FOUC which covers editing the Critical CSS that we generate and defining your own.
At this moment in time, WP Rocket doesn’t generate Critical CSS for both desktop and mobile devices, however, it is planned to in an upcoming release (either 3.6 or 3.7). Given the nature of the issue you’re facing I would expect this to be resolved for you in a future release.
Let me know if you need any further assistance, I am happy to help. 🙂
This is revert I got from Wp Rocket, Can you guys please help me in this?
I can play with CSS but I don’t know how to fix issue in this case.
I am using Critical CSS with my other gpsites, but I don’t know whats wrong with this one.May 28, 2020 at 8:05 am #1305176DavidStaffCustomer Support
I am not sure what help we can provide … generating Critical CSS is a complicated process and varies greatly from site to sites, and this requirement is out out of this forums scope.
Personally i would disable the automated Critical CSS and see what actual difference it makes to the site loading before wasting too much to much time on the matter.May 28, 2020 at 9:33 am #1305298Umesh
What I am able to understand after comparing these to sites (staging) and (live) it is not loading responsive [media=”(max-width: 768px)”] CSS from woocommrce related CSS file in to Critical CSS. Why is it so happening I don’t know.
I know it is a complicated process to fix the issue in Critical CSS, but it needed to improve FCP and after a recent update of PSI, it seems crucial.May 28, 2020 at 2:09 pm #1305594TomLead DeveloperLead Developer
Is it possible to exclude files from the critical CSS functionality? If so, I would exclude those files that rely on the media query inside the request.May 28, 2020 at 2:55 pm #1305637Umesh
No, it is not possible to exclude files from the critical CSS functionality.
But on my staging site homepage products are not part of critical CSS but still, it is messed up on mobile and woocommerce media query is not loading.
I have checked with fresh install too of prime template, And it is still breaking site’s woocommerce related stuff.
Have done this just to confirm that I have not done anything wrong with my site.May 29, 2020 at 8:59 am #1306608TomLead DeveloperLead DeveloperMay 29, 2020 at 12:19 pm #1306886Umesh
There is no page that is broken with critical CSS turned off.
It happens only after critical CSS is turned on.
Thanks for your support, I have never seen such good support you guys are awesome. I will wait for wp rocket to push an update.
Thanks for this thread https://generatepress.com/forums/topic/replace-gp-search/ this helped me to replace default search with woocommerce AJAX search. You should add this in generatepress docs, it will help many people, just a suggestion.
But I am having a problem, search results are still displaying even after search is closed.
Sometimes this works fine and sometimes this happens on mobile and desktop both: https://ibb.co/Z6HxT1s
Do you have any fix for this?May 29, 2020 at 4:57 pm #1307097TomLead DeveloperLead DeveloperMay 30, 2020 at 5:30 pm #1308199Umesh
I am seeing this issue more often on mobile and tablet view.
1. open the site in mobile view and refresh then try to search.
2. open the site in tablet view and refresh then try to search.
EDIT: I changed the AJAX search plugin, so everything seems fine now.
Thanks for the guide.
- You must be logged in to reply to this topic.