SSL certificate breaks CSS (in combination with W3TC)
Dear StackExchange community,
I am struggling with the following problem and simply cannot find a solution:
I have installed a SSL certificate but it causes the CSS of my website to break when the plug-in "W3TC" is activated (example: https:// www.planetofsuccesscom/blog/).
Here's how I installed the certificate and how I tried fixing the problem:
- Deactivated W3TC
- Updated my site URL to https within the WordPress dashboard (Settings » General and updating your WordPress and site URL address fields)
Redirected http to https via .htaccess file with the following code:
RewriteEngine On RewriteCond %{SERVER_PORT} 80 RewriteRule ^(.*)$ https://www.myurlofcourse.com/$1 [R,L]
At this point, it all functions. However, as soon as I activate the W3TC plug-in, the CSS breaks (even after page cache was purged). For this reason, I've tried installing the following plug-ins:
- WordPress HTTPS (SSL)
- SSL insecure content fixer
However, these plug-ins didn't solve the problem.
In the next step, I checked whether the option "Cache SSL (https) requests" was activated in W3TC, which it was. Also, I disabled "Minify CSS" and "Minify JS" but it didn't change anything after purging the page cache.
I am using Amazon CDN, so I changed the settings in W3TC SSL support from "auto" to "always HTTP" but it did also not affect any changes.
In my cloud flare account, I've switched from simple SSL to full SSL but that didn't solve the problem either.
I also read the following question and its helpful answers (here: SSL Breaks Wordpress CSS) but it unfortunately did not allow me to solve the issue.
Similarly, reading the support forums of my template provider regarding SSL issues didn't help me to find a potential problem with the template.
In short, I think it all boils down to one particular problem with the W3TC plug-in but I am unable to find it.
(I reversed all the redirect changes I've made)
Do you have any other ideas how I could solve the issue?