Hey @jurriaankoops! I took a look at your site and found the issue. The chat-style.css file is being loaded correctly by the plugin, but something on your site (likely a caching or performance optimization plugin, or a server-level optimization like LiteSpeed) is converting the stylesheet link into a preload link. The preload is supposed to switch back to a regular stylesheet after the file loads, but that switch isn’t firing on your site, so the CSS never actually gets applied.
The fix is to either clear your optimization/preload cache, or exclude the following stylesheet from your CSS optimization:
/wp-content/plugins/mxchat-basic/css/chat-style.css
If you’re using LiteSpeed at the server level, you may need to add that exclusion in your server config since the plugin already adds a data-no-optimize attribute but it’s being ignored.
The CSS itself and all the selectors are working perfectly. Once the caching layer stops converting it to a preload, everything should display as expected.
Hi @m4xw3ll,
I was looking into the issue and found this in the page source:
<link rel="preload" as="style" id="mxchat-chat-css-css" href="https://gravitywp.com/wp-content/plugins/mxchat-basic/includes/../css/chat-style.css?ver=3.1.8" media="all" onload="this.onload=null;this.rel='stylesheet' data-no-optimize='1'">
It looks like the plugin modifies its CSS tag (to add data-no-optimize), and something else on the site is also converting it to a preload. Those two conflict and end up breaking the tag, so the CSS never actually loads.
As a temporary fix, I added a small MU plugin that removes all modifications to <link> tag with id “mxchat-chat-css-css”, which resolved the issue.
You might want to reconsider forcing data-no-optimize='1', as it seems to interfere with other optimizations.
Hi @sylveex it does appear that even when trying to prevent caching plugins from causing issues they still cause issues… I did remove this in the most recent update today.
