DEV Community

loading...

From Ghost Blog to Static Site

Eli
Originally published at eli-xciv.github.io ・2 min read

I've always liked the Ghost Blogging platform since it was released years ago. I like it's editor, CMS, among other things. However, I don't like that I can't host it as a static site (SS). I want to be able to use the like of Netlify, Github/Gitlab pages or any other static hosting provider. I started googling and found Ned's blog post. He explained his requirements which was exactly what I was looking for. He didn't explain everything, but did a good job at the overview, and so I did some of my own edits.

Note: SS version of ghost does remove some features, so check Ned's list to make sure you don't need them. I didn't because I was going for simple, and I mean really simple.

Basically the pipeline for doing a Static Site from Ghost is as follows

  1. Setup a local instance of Ghost (I'm using a container w/ podman
  2. Create the site per your wants
  3. Create a Static Site from the local ghost installation
  4. Host the static site (We'll go over using Github pages, but you could use anything else)

Setting up local Ghost installation

I'm using podman so.... I can get up and running with one command....

podman run -d --name ghost -e url=https://localhost:8080 -p 8080:2368 ghost
Enter fullscreen mode Exit fullscreen mode

Now I can point my browser to https://localhost:8080

Creating your site

Checkout the Ghost docs to set up your site. I'm doing a simple blog using the Attila Theme, modified of course.

Creating the static site

Now this is the bread and butter. There's a nifty npm package called ghost-static-site-generator

(sudo) npm install -g ghost-static-site-generator
Enter fullscreen mode Exit fullscreen mode

That command will install a utility called gssg.

Now gssg will basically go to our local ghost installation and pull down a static version of the site.

Hosting + Git

I'm using github, follow their guide to create a Github pages repo.

git clone <your_pages_repo>
Enter fullscreen mode Exit fullscreen mode

** Edit the Settings for your repo to deploy the /docs folder from your repo
settings

Now we're going to get a static site into /docs.

gssg ---domain "https://localhost:8080" --url "https://eli-xciv.github.io" --dest docs
Enter fullscreen mode Exit fullscreen mode

Now all you need to do is to commit and push the repo to Github and it will publish your static site.

git add . ; git commit -m "First commit of Ghost Static Site"; git push -u origin master
Enter fullscreen mode Exit fullscreen mode

Voila! in a second or so, your static site is hosted on github.io!


Extras

In my repo I've created a script under bin/migrate.sh that will run the migration, and commit it to github in on fell swoop.

#!/bin/bash
printf -v date '%(%Y-%m-%d %H:%M:%S)T\n' -1

gssg ---domain "https://localhost:8080" --url "https://eli-xciv.github.io" --dest docs

git add .

git commit -m "Blog Update: $date"

git push
Enter fullscreen mode Exit fullscreen mode

Discussion (0)