Posted in Ghost â€ĸ â€ĸ

How to deploy a Ghost site for FREE

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 :

The Good:

  • 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.

The Bad:

  • 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.

Install Ghost on your computer

To install ghost, you need to have Node.js installed first. See the supported versions of Node.js following this method:

Install Node.js

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.

Install Ghost CLI

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

Here, -g stands for global installation.

Install Ghost Instance

First, create a separate directory for our ghost site in ~/ghost/site by running mkdir ~/ghost/site. Then, navigate to that directory cd ~/ghost/site.

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: http://localhost:2368/ghost.

Some useful terminal commands for Ghost:

  • If you want to stop the ghost instance, run ghost stop
  • For starting a Ghost instance, run ghost start
  • To restart an already running ghost instance, run ghost restart
  • To see the list of all Ghost instances from your computer, run ghost ls

From the Ghost admin, you can add posts, tags, pages, customize colors, change themes, set navigation elements and many more.

Make Ghost đŸ‘ģ Static

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:

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 ~/ghost/production:

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

Here:

  • --sourceDomain is where the ghost site is running. In our case it’s http://localhost:2368
  • --productionDomain is the domain where your final site will be available publicly. In our case it’s http://www.mysite.com

Setting the --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

Deploy static site

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.