Fix mixed / insecure content warnings for Ghost on Raspberry Pi

Until recently, Ghost Pi was secure without issue over HTTPS. However a change to Ghost started issues with mixed / insecure content. Learn how we fixed it!

Fix mixed / insecure content warnings for Ghost on Raspberry Pi

Installing Ghost 2.19.4 and above on a Raspberry Pi running Raspbian is now, thankfully, a fairly straight-forward process especially if you have been following Ghost Pi's various guides. However, there can be some issues that can frustrate many users, particularly if you are looking to boost the SEO for your Pi-hosted Ghost blog.

With so many websites online, it is often a challenge to get your Ghost blog on the first page of Google, but if you ensure your Ghost site keeps up-to-date with SEO best practices, such as utilising HTTPS vs. HTTP, then that is one key area you can get right.

Did you know that as of July 2018, Google Chrome displays the "not secure" message for all non-HTTPS websites?

Now, whilst not all HTTP websites or Ghost blogs have malicious intent, the new stance by Google means that people visiting a non-HTTPS website may find it untrustworthy and could put them off visiting altogether.

HTTPS vs. HTTP

If you aren't technically minded, don't worry! HTTP stands for HyperText Transfer Protocol and HTTPS means HyperText Transfer Protocol Secure. Essentially, you can make your Ghost blog secure by installing a SSL certificate and enforcing HTTPS to all your visitors. This means that any traffic between your visitor's browser and your Ghost blog server (e.g. your Raspberry Pi or ASUS Tinker Board) is encrypted, meaning it is less susceptible to a Man In The Middle (aka. MITM) attack.

Mixed or insecure content issues on Ghost

Until recently, Ghost Pi was set to use HTTPS and, as we covered in a previous guide, was as secure as possible according to Qualys SSL Labs and their free SSL test, scoring an A+ in all areas. However, in a recent update to Ghost the "mixed" or "insecure content" issue had crept in, which was frustrating.

Doing some digging around, with the help of a free tool called Why No Padlock, we were able to identify that some of our newer posts had started to show images over plain HTTP instead of the preferred, and more secure HTTPS and this was puzzling.

Fix the mixed / insecure content warning in Ghost

It turns out that when Ghost Pi initially managed to get Ghost running on Raspberry Pi / Raspbian, the Ghost URL was set to use HTTP instead of HTTPS in order to overcome the issue of creating a free SSL certificate via Lets Encrypt, which the Ghost-CLI tool does automatically.

The problem is that if you set your Ghost blog's URL to use HTTPS during the initial configuration, the SSL certificate generation would typically fail unless you opened specific ports in your router to allow this to happen. This is easily overcome if you do not host any other online tools from home, but as the guys at Ghost Pi often do, it meant that keeping ports 80 and 443 open were not always suitable.

Change your Ghost's URL to use HTTPS

Thankfully, this seems to be a common enough issue for the team at Ghost to include a guide on their website on how to fix this, but it does not apply fully to a Raspberry Pi hosted Ghost blog. Instead, we followed these steps:

First, we need to change into the directory our Ghost blog is installed - for Ghost Pi, this is:

boo@ghost-pi ~ $ cd /mnt/raid1/nginx/ghost

Next, we need to use the Ghost-CLI tool to run the following command:

boo@ghost-pi ~ $ ghost config url https://ghostpi.pro

Of course, you'll need to substitute your domain with https://ghostpi.pro accordingly.

Next, you'll need to change a setting in your NGINX configuration file to ensure that HTTPS is used. Again, this can depend on your setup but if you followed our guide on setting up RAID-1 on Raspberry Pi, this will be /etc/nginx/sites-enabled/ghostpi.pro.conf although the ghostpi.pro.conf will be your blog's URL:

boo@ghost-pi ~ $ nano /etc/nginx/sites-enabled/ghostpi.pro.conf

Be careful as changes in here could break your website - we always recommend you make a backup just in case things go wrong!

Now, find the line that is proxy_set_header X-Forwarded-Proto $scheme; as we'll need to change this to proxy_set_header X-Forwarded-Proto https; before saving and exiting with CTRL+X and Y. This is how our NGINX configuration file looks after we've adjusted it:

server {
    listen 80;
    listen [::]:80;

    server_name ghostpi.pro;
    root /mnt/raid1/nginx/ghostpi/system/nginx-root;

    location / {
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto https;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $http_host;
        proxy_pass http://127.0.0.1:2368;

    }

    location ~ /.well-known {
        allow all;
    }

    client_max_body_size 50m;
}

The final steps here are to restart our Ghost blog and reload the NGINX configuration, which is done using the following three commands:

boo@ghost-pi ~ $ sudo nginx -t
boo@ghost-pi ~ $ sudo nginx -s reload
boo@ghost-pi ~ $ ghost restart

The three commands will test your NGINX configuration for errors, reload NGINX and then finally restart your Ghost blog. If all goes well, you should now be able to access your Ghost blog using HTTPS exclusively and testing it on Why No Padlock should pass with flying colours!

This guide assumes you are using CloudFlare as a CDN for your Ghost blog, as well as utilising their SSL setup as outlined in one of our earlier guides. If you are using the in-built SSL setup done via the Ghost-CLI tool, then it may not be an issue or the steps may vary, but the principles remain the same.

If you found this guide, as well as any other guides on Ghost Pi helpful, then if you wanted to buy Ghost Pi a coffee to show your support, then that would be greatly appreciated! As this site does not use any form of adverts, all the costs for running and maintaining the blog are done voluntarily so any extra would be fantastic!

Buy Me A Coffee