I've been working on an infosec volunteer website to help people stay safe on the Internet, but the website needed to have a custom homepage/landing page with the Ghost content not being delivered on the root of the domain. All fine and dandy, plenty of tutorials online for that, also a fun way to learn how Ghost is different from WordPress which I've been using for the last 15 years.
With that out of the way, I wanted to ensure all of the content was being delivered by HTTPS. Signed up for Let's Encrypt and setup SSL on the server. Easy. But some of the pages kept coming up with that pesky "insecure content" or "mixed content" warning despite everything being setup correctly.
HTTPS vs. HTTP: HTTP stands for HyperText Transfer Protocol and HTTPS means HyperText Transfer Protocol Secure. Essentially, you can make your Ghost blog secure by installing an SSL certificate and enforcing HTTPS to all your visitors. This means that any traffic between your visitor's browser and your Ghost blog server is encrypted, meaning it is less susceptible to a Man In The Middle (aka. MITM) attack.
This is when I realized I had set the website URL itself to http:// and Ghost calls the absolute paths to images, which frankly took me by surprise. You can find out what's causing the warning either by using your browser's dev tool to "inspect" the website (right-click anywhere on the webpage and click Inspect, or press Ctrl + Shift + I), or by using a service like WhyNoPadlock. The images I had in my posts and the "author" background image were being rendered without SSL. Once this was caught though, it was relatively easy to fix. Just run:
ghost config url https://my-domain.com
Or, if you're running it on Docker, change the environment variable called "url" to https://my-domain.com. Reuploaded all images into their posts again, and voila - fixed in less than the time it took to write this post, lol.
Next up is to get a better grade on the Qualys SSL test. Soon.