Static hosting a Ghost site without any backend server
Ghost is one of most popular CMS platform for blogging, personal portfolio, publication, magazine, newsletter and so on. Many independant creators love ghost for its’ simplicity, customizability, wide range of beautiful free and paid themes, elegant editor.
Ghost is based on Node.js and requires hosting server to host the site. They also offer Ghost Pro where you have to pay a fee and the technical parts will be managed by the Ghost team.
But, many of the independant creators don’t have budget or investment at the beginning and they just want to start their content business and scale later on. This article shows the step by step guide for them to host their Ghost site for FREE!
This procedure requires some technical understanding of terminal or command line. But, I will discuss it in a easier way for all.
The good and the bad of Ghost Static hosting :
- Static hosting is possible FREE of cost.
- Static sites are super fast as no server side rendering is required.
- As there is no backend, login or admin, there is nothing to hack. Static sites are pretty secure.
- Global CDNs for static pages make the site even faster.
- You cannot enable Ghost membership if you host static pages.
- For comments, reactions you need to use third party tools like disqus, commento, facebook.
- You cannot offer member only content.
There are several methods to install Node.js in your computer. Refer to Node.js documentation for more information or install Node.js using NVM (Node Version Manager).
- Install NVM:
curl -o- <https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh> | bash
- Install Node version 18.18.0 LTS:
nvm install 18.18.0 nvm use 18.18.0
Check the NVM Readme for updated versions of NVM and Node.js.
To install Ghost CLI (using this we will create a ghost site locally in our computer later), run this in terminal:
npm install ghost-cli@latest -g
-g stands for global installation.
First, create a separate directory for our ghost site in
~/ghost/site by running
mkdir ~/ghost/site. Then, navigate to that directory
Now, using Ghost CLI let’s install ghost locally in our computer:
ghost install local
Once the installation is done, a ghost instance will be started and accessible at the URL:
http://localhost:2368. Browse the URL and it will ask for your site’s name, email address, password once in the first run. After setting these up, you’ll be redirected to your site’s admin panel. You can always visit the admin panel later using the URL:
Some useful terminal commands for Ghost:
- If you want to stop the ghost instance, run
- For starting a Ghost instance, run
- To restart an already running ghost instance, run
- To see the list of all Ghost instances from your computer, run
ghost startin Linux machine then run this command:
ghost start --no-setup-linux-user
From the Ghost admin, you can add posts, tags, pages, customize colors, change themes, set navigation elements and many more.
Ghost, by default is a CMS which obviously has a dynamic architecture where there is a database to store contents, a backend server to process requests. But, if we want to host our Ghost site for free, we have limited or no option available out there. But for a static site, there are plenty of options available to host JAMstack sites for free! And static sites are blazing fast and secure.
For this, we need to convert our ghost instance to a static site. For this, we can use Ghost Static Site Generator tool from this repo:
Generate a static site from ghost and deploy using a CI - GitHub - Fried-Chicken/ghost-static-site-generator: Generate a static site from ghost and deploy using a CI.
To install and run the tool you first need to have
wget installed, then run:
npm install -g ghost-static-site-generator
After installation, create an output directory somewhere in your computer where the static files will be generated. Let’s say, the directory will be
mkdir ~/ghost/production cd ~/ghost/production
From here, run this command to generate the output files:
gssg --sourceDomain http://localhost:2368 --productionDomain http://www.mysite.com
--sourceDomainis where the ghost site is running. In our case it’s
--productionDomainis the domain where your final site will be available publicly. In our case it’s
--productionDomain tells the tool to convert the anchor links and image sources for mysite.com.
The above command will generate the static site at
~/ghost/production/static directory. To preview the static site, run
gssg --preview. Detail documentation can be found here.
Make a script to automate the tasks (optional):
I would suggest you to run
rm -rf static inside
~/ghost/production/ directory everytime before running
gssg to remove old files and generate new static files. To handle all this, you may make a script like this:
# go to ghost directory cd ~/ghost/site # start ghost ghost start # go to a static production directory cd ../production # remove old files rm -rf static # generate static files gssg --sourceDomain http://localhost:2368 --productionDomain http://www.mysite.com # move back to ghost directory cd ../site # stop ghost instance ghost stop
Now you can deploy your static site anywhere you want. There are plenty of free options available out there. Some popular services include Netlify, Github Pages, Gitlab Pages, Firebase Hosting, Cloudfare Pages, AWS S3, AWS Amplify, Zeit, Forge and more!
Remember, you need to deploy only the files from
~/ghost/production/static directory to the hosting service. You can upload directly (for example, in Netlify it’s
netlify deploy --prod, in Firebase it’s
firebase deploy) or link a Git repo to deploy the site.
And done! You have made your Ghost site publicly available without any cost.