Recently I made the plunge with our agency in switching from HTTP to HTTPS, for many reasons:
- Google is now handing out “insecure notifications”
- it is an SEO ranking signal, for real
- other benefits like social proof
- with HTTP2, it can make your site faster
- oh, and it makes your site more secure 🙂
So I took the easy way out, and went with Let’s Encrypt. It was so easy with WordPress / WHM etc / AutoSSL. While I’d like to say it only took 5 minutes to install (which is true) fixing a lot of these mixed content warnings were kind of a pain especially with MaxCDN’s custom subdomain.
On our agency website, all of our images are were served up using a subdomain via MaxCDN:
Old MaxCDN Domain Example (insecure) http://cdn.elite-strategies.com/wp-content/09/image.png
New MaxCDN Domain Example (secure) https://elitestrategies-elitestrategies.netdna-ssl.com/wp-content/09/image.png
But when we enabled SSL, we found out we needed to either upgrade to MaxCDN’s SSL as a service plan for $99/month or use their free “shared” service for free. We opted for the free service, being that we generally don’t have the need, and thought the pricing was a tad high for what we were getting.
Enabling SSL via MaxCDN is rather easy. Just log into your account, go to your pull zones and enable shared SSL. From there you can get the new domain for your images.
So now instead of our nice looking subdomain we serve all images from one of MaxCDN’s domains. Not really what I wanted but whatever.
Here you can see Firefox Web Developer tools spitting out mad errors:
In short, my old image path was insecure and did not match my new (secure) image path from MaxCDN.
The issue is, once we enabled SSL all of our old images were still being served from our old CDN subdomain. This caused 2 issues:
- possible and potential 404 errors
- mixed content warnings
The thing about the mixed content warnings is, if your browser (Chrome, Firefox etc) hands you a warning it really doesn’t consider your website “secure” which is really not ideal.
So now I have this new secure CDN URL path and need to run a find and replace across our whole website to find occurrences of the old one, and replace it with the new one. There are many ways to carry out this task:
- using a WP plugin
- command line
- PHPMyAdmin
- Other tools
My personal favorite is a neat little PHP script made freely available from the folks at interconnect/it. They used to make it directly downloadable but now they make you acknowledge this thing…probably from too many people screwing it up :). Here is the link to the page where you can download it. I also prefer the old version over the new one, it is much simpler I think. All the source code is contained within 1 file, which I love.
The tool is easy, just drop it in the home directory path using FTP etc, and RTFM. It is really easy to use but also really easy to screw up!
Here you see I am replacing my old path with the new one.
Sometimes when running a find and replace on a domain I won’t include http, slashes, colons etc. In this I am including it since the characters I want to find and replace are not only the domain but the http / https as well.
You can see here the tool did its job.
This tool is also great for when you first switch over to HTTPS. You can run a find and replace on your entire domain and scan for occurences of your old http domain and replace with the new. Just don’t do a find for “http” and replace with “https” as it will scan for other domains in your database that might not be yours. Use the full path of your domain.
After a hard refresh (Ctrl + F5) you can see now we have a nice SSL’d website with no mixed content warnings. Be sure to manually check 5, 10, 20+ pages on your site to be sure you didn’t miss anything.
Very important – if you did use the tool that I recommended, be sure to delete it when you are done. If an attacker finds this script, they can mess your site UP in a very horrific way.
Imagine if they found this script and replaced all with pornhub.com images or something!
Anyway, if this post helped you out consider linking to it on your blog or sharing it on Twitter / Facebook /G+Â / LinkedIn etc. Or if you didn’t like it let me know why I always appreciate feedback positive or constructive!
Adios!
Comments are closed.