Question

Magento 2.3.6. We are trying to increase the pagespeed of the porto magento theme and we got recommendations to use critical css path.

We followed up the instructions for critical css path:

https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-critical-path.html

In short, we did this:

  • echo '.test {}' > app/design/frontend/Smartwave/porto/web/css/critical.css
  • bin/magento config:set dev/css/use_css_critical_path 1
  • bin/magento c:f
  • bin/magento setup:static-content:deploy -f --jobs 4 en_US en_GB
  • bin/magento c:c; bin/magento c:f

We tried to add a critical.css file in porto main theme:

$ cat app/design/frontend/Smartwave/porto/web/css/critical.css
.test {}

Instead of the expected .test {} (regardless of the critical.css content, happens even with a critical-css-generated content) in the html's <style> </style>, we get a different content than the expected one.

This makes me think the porto theme has a different filePath for critical.css?

Magento 2 docs recommend placing it as web/css/critical.css

Where should we place the critical.css file for porto theme? Or does it required some extra configuration to be applied?

Thanks

No correct solution

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top