auaras
Forum Replies Created
-
I can not replicate the issue on two sites hosted on two different servers, both using Litespeed server and cache.
If i access the same page more than once, I got a x-litespeed-cache HIT, as expected.
If I clear the Elementor Cache, I got a x-litespeed-cache Miss – the page are flushed and clearly completely rebuild and the post CSS got new query strings, matching those in the HTML.
Not sure if Elementor flush the Litespeed-cache, or Litespeed detects the post CSS files got new query strings – one way or the other, if you happen to be on Litespeed server – use the Litespeed-cache.
And no, I did not test WP Fastest Cache on the Litespeed server…- This reply was modified 8 months, 1 week ago by auaras.
You – and others with the same problem may try enabling Optimize CSS Code in Autoptimize.
I see two effects:
1. The missing Elementor post CSS are instantly replaced with Autoptimize CSS – no more 404
2. Apparently, no matter if the page are cached or not – Autoptimize ignore the Elementor cache and create its own CSS – and deliver that.You may try this.
1. enable Optimize CSS Code in Autoptimize
2. Clear all cache, browser, Autoptimize, WP Fastest Cache, and the Elementor Cache
3. Access single page on your website, Autoptimize has created the needed post CSS – and the page looks as it should.
4. delete Elementor Cache again – check with FTP, yes all files gone – we got a 404 problem, or do we?
5. No, the HTML points to Autoptimize CSS, you are good, even with a completely empty /wp-content/uploads/elementor/css folder
6. The bad part…..since Autoptimize now has cached the CSS – within its own cache folder….the files supposed to be in /wp-content/uploads/elementor/css folder are NOT regenerated – as they are not needed.
7. The good part – if you clear the Autoptimize cache, Autoptimize not only re-generate CSS for what ever page you access, page cached or not – and the Elementor cache CSS are generated as well – but not used – and your page looks as expected?
8. The bad part, chapter 2. If you monitor /wp-content/uploads/elementor/css with FTP….
New files shows up….when accessing pages with no formerly cached CSS – that’s great, but…..they also got deleted again….not within 24 hours…within a way shorter timespan?Element Cache can NOT be disabled from with Elementor – and CSS files are deleted…and NOT regenerated, if you use a page cache….creating 404’s and garbled design – Apparently, this is not a bug, but at feature.
If you manually, or Elementor, clear the “Element Cache” – activated or not! – and you use a page cache, the post-xxxx.css got deleted from /wp-content/uploads/elementor/css and are not regenerated until the page cache expire, or a cleared otherwise.
For some reason Autoptimize can regenerate new CSS, even the HTML page are already page cached – and Elementor can’t – as I see it.Elementor gives you two choices:
1. The CSS will be completely missing
2. – or if your lucky, being served with a different query string attached, compared to what is written in the cached HTML file.
Same result, 404 on your post-xxxx.css…and garbled content- This reply was modified 8 months, 1 week ago by auaras.
@morphiazz, yes…unfortunately we are both right…
CSS are deleted and NOT re-generated by Elementor
As Elementor claim in the setting:
“We’ll regenerate those files the next time someone visits any page on your website”Is not true – unless the page cache are disabled.
Switching to WP Super Cache does not solve the problem!
If a page are residing in the page cache, that be WP Super Cache or WP Fastest Cache – and the Elementor cache are cleared, Elementor does not detect next time that page are read, not even with browser caching disabled and a “hard” re-read performed – and the layout are destroyed.
Before a third wold war brakes out..
First a simple solution, then an explanation – sort of.
A simple solution:
Install Autoptimize https://wordpress.org/plugins/autoptimize/
Disable JS and CSS optimizationGo to settings and Extra (Extra Auto-Optimizations)
Enable “Remove query strings from static resources”
(Removing query strings (or more specifically theverparameter) will not improve load time, but might improve performance scores.)Alternative could be using another cache plugin with the same feature (Remove query strings)
Or write some code to function.php in your child theme.So, what is the problem in first place – I’m no expert, but this is kind of a logic issue…
Elementor generate dynamic CSS for some widgets – like this: elementor-post-1784-css
I also gives that CSS a version number! – like this/wp-content/uploads/elementor/css/post-1784.css?ver=1760188839
So what happens when you refresh your CSS from within Elementor?
It gets a NEW version number!
/wp-content/uploads/elementor/css/post-1784.css?ver=1760192914Same CSS file – with a new name, or rather a new “query string”
Unfortunately, your HTML file…knows nothing about this renaming business – as the file cache like WP-Fastets Cache, are not flushed/refreshed, but still look for /wp-content/uploads/elementor/css/post-1784.css?ver=1760188839
A file that no longer exist, hence the server return a 404…and a 404 are not a CSS Mime type – so the request is blocked – or return a 404, depending of the visitor. – and your design are trashed.
If your flush your website cache – like WP-Fastets Cache – the HTML are re-read from the database, pointing to the Elementor CSS – with the new “query string” – and your design are back.
By removing the “query strings” with Autoptimize, the problem goes away – no query strings, no problem – because your CSS are not deleted, the file are not renamed…it is just re-saved with a new query string, and your cached HTML are still looking for the query string you had, before you – or Elementor, decided to save the same CSS file with a new “query string”
I got no idea, if removing the query strings make other errors creep in, I have used it for ages..without problems.