Maybe the reason is that the order of styles and classes in optimized file doesn’t match original order of files and css styles. For example, if on page styles and styleshits order is: some file with styles, after that wp_enqueue_script, then some other style, – then the optimized file with css styles should match the original order styles and classes in it’s file (styles from first file at the beginning, then styles from wp_enqueue_script, then other styles, etc.).
And why the problem doesn’t appear on website when admin account is used..?
For some reason it apply some strange styles for half a second, that are not visible when option is disabled. So website design just for a moment on load looks strange.
So “in the end” the site looks OK? Did you exclude some CSS from being autoptimized? Or do you have CSS pulled in from another domain?
remove styles from parent theme that are in the child (parent theme styles minus child theme styles (styles in classes, but now whole classes completely).
that would require some advanced CSS-intelligence in AO, which I think would be to complex and frail to do.
Maybe the reason is that the order of styles and classes in optimized file doesn’t match original order of files and css styles.
No, AO typically honors the original order actually.
My best guess; although AO aggregates & minifies the CSS, there is part of it which AO does not aggregate (reasons: excluded in settings, generated by PHP or external CSS), which is applied just before or just after the AO-CSS. The time between these different CSS-files being loaded causes the brief “Flash Of (partly) Unstyled Content”.
hope this helps,
frank
So “in the end” the site looks OK? Did you exclude some CSS from being autoptimized? Or do you have CSS pulled in from another domain?
Yes, “in the end” it looks fine. I didn’t exclude any css, because I don’t know where to start with. All website css files are stored localy on my localhost testing server.
There are definitely no external CSS.
I will try to locate “promblem” css by disabling each file and inline css step-by-step. I hope I will find solution.
Thank you for the fastest feedback! You’rethe best developers!
Good news!
I found the reason why it’s happend.
The reason is in this code:
if ( !function_exists( 'chld_thm_cfg_parent_css' ) ):
function chld_thm_cfg_parent_css() {
wp_enqueue_style( 'chld_thm_cfg_parent', trailingslashit( get_template_directory_uri() ) . 'style.css' );
}
endif;
add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css' );
It is automatically generated code by https://wordpress.org/plugins/child-theme-configurator/ of child function.php. This code load child theme style right after parent theme style.css.
After disabling this code – all becomes normal. But it works if “Optimize CSS Code” option is enabled at the same time. For example,
disalbe AO + keep enable those code in function.php – works fine!
enable AO + keep enable those code in function.php – doesn’t work.
enable AO + disable those code in function.php – works fine!
I suppose WordPress versions of past years doesn’t require such code.
Otherwise it need to re-enable those code in function.php in future when AO plugin will be deactivated. Hopes this help for others, who uses the same function.
You can close topic. Thanks a lot!
great find, happy it works esemlabel!
frank
