WordPress, HTTPS, CDN and W3 Total Cache

I’ve worked with a few sites recently that use HTTPS to secure certain parts of there site and also a couple of pages here are SSL protected due to the data captured. If you use the W3 Total Cache plugin like I do, and I really recommend that you do if you have a wordpress site, and make use of its CDN functionality, you might hit the following snag:

My CDN provider doesnt provide a HTTPS endpoint or its different to my normal CDN URL

the simple solution to this would be, to force loading of cdn assets via HTTP like so:

 

 

 

 

This has one other issue

Why dont i see the Blue/Green Bar?

That’s because your loading HTTP assets on a HTTPS page, for some this is an acceptable tradeoff. but for some this is bar is a must to convey trust to users. Thankfully the solution is fairly simple, Disable the CDN on SSL pages. To disable the CDN on SSL pages only add the following code snippet to your themes functions.php file, this snippet requires the W3TC plugin to be enabled and working to work as its code that tells W3TC: “hey, don’t load the cdn on this page!”

add_action('wp_head','nocdn_on_ssl_page');
function nocdn_on_ssl_page() {
if ($_SERVER['HTTPS'] == "on") {
define('DONOTCDN', true);
}
}

reload an SSL page and watch the address bar and do a view source to see the results!

4 thoughts on “WordPress, HTTPS, CDN and W3 Total Cache

  1. Maylene Kuahiwinui

    Thank you so much! This had been driving me crazy. I knew I had a problem with the WordPress HTTPS plugin but I couldn’t tell if the conflict was with Gravity Forms or W3TC. Searching the latter brought me here – what a simple, elegant solution.

    Reply
  2. Pingback: WordPress, HTTPS, CDN and W3 Total Cache - Take 2 | Somerset Technical Solutions

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>