Minified assets randomly load via HTTPS

It seems like the root of the problem with minified assets loading via HTTPS is due to your site not using SSL. Without HTTPS enabled, assets trying to load via HTTPS will fail. The simplest fix is to enable SSL on your site. You can get a free SSL certificate through services like Let’s Encrypt, which most hosting providers offer. Once SSL is in place, your assets will consistently load via HTTPS, and the issue should be resolved.

Regarding the preloading issue, turning it off helps because preloading might be caching pages with mixed HTTP/HTTPS content, causing inconsistent loading. With SSL enabled, you should be able to keep preloading on without any further problems.

As for the child theme CSS being overridden by the parent theme’s minified styles when using the inline option, you can fix this by either:

1. Exclude the child theme’s CSS from processing: In WP-Optimize settings, under “Exclude the following CSS files from processing,” you can add the child theme’s CSS file. This will stop it from being minified or merged, keeping it intact so that it’s applied after the parent theme’s styles.
2. Load the child theme’s CSS asynchronously: Alternatively, you can add the child theme’s CSS file to the “Load the following CSS files asynchronously” section. This ensures the child theme’s styles load independently, avoiding conflicts with the parent theme’s minified CSS.

Both options should help resolve the issue of the parent theme overriding the child theme’s CSS. You can choose whichever method best suits your setup!

Let me know how it goes.

Many thanks for your full reply.

I’m not sure if the root of the problem is not using an SSL certificate, as surely the preloading functionality should respect the fact I’m not, and always load assets over the specified HTTP protocol (we’re talking about local, minified and merged CSS and JSS which is just sometimes being wrongly loaded over HTTPS). However, I agree it is much better to have an SSL certificate, and that would circumvent the issue. Unfortunately my current host doesn’t accept Let’s Encrypt certs (!), however we will still get another one anyway, as it is worth it for various reasons including this.

Re. the second point, thanks. I had seen these settings but thought that using them might have the negative effect of opting those files out of processing completely. I’ve now tested both, and in both cases the child styles are still overridden by the parent styles:

In case 1 (excluding), the link tag for the excluded child CSS is placed before the link tag for the (minified) parent CSS, thus it is still overridden. In case 2 (loading asynchronously), the script tag for the deferred child CSS is placed before the link tag for the (minified) parent CSS, which seems to matter: even though that child CSS file loads after the parent CSS, it is still overridden.

So, I tried instead placing the path to the parent theme CSS in these boxes. In case 1 (excluding), the link tag for the excluded parent CSS is placed after the style tag for the (minified) child CSS, thus the child CSS is still overridden. In case 2 (loading asynchronously), the script tag for the deferred parent CSS is placed before the style tag for the (minified) child CSS – and this works, even though the parent CSS file loads after the minified CSS file.

Although I think there are still underlying issues here, you can mark this as resolved, if you like, as we can get around them, at the cost of 1) needing an SSL cert and 2) not processing the parent CSS file, or not inlining CSS at all (I will probably stick with the latter…).

I see what you mean about the preloading and HTTPS situation—it definitely seems like the preloading should respect your HTTP setup, but it’s great to hear that you’re planning to get an SSL certificate anyway. That should definitely help in the long run, even if it’s a bit of a workaround for now.

As for the CSS issue, I get what you’re saying about the exclusion and asynchronous options not quite working as expected. It sounds like your solution of deferring the parent theme’s CSS is the right call for now, even though it’s not perfect. Sometimes getting that load order right can be tricky!

It’s awesome that you’ve found a way to work around the issue with inlining by just not processing the parent CSS. If that’s working for you, then I’d say stick with it for now, especially since it avoids the child styles getting overridden.

Feel free to mark it as resolved, but don’t hesitate to reach out again if anything else pops up or you need further help down the line! Thank you!