How to setup personal blog using Ghost and Github hosting
Setup Ghost from source on local machine and use default Casper theme. Host the blog on Github for free.
- My system info
- Short summary of what we are going to do.
- Install Ghost locally and it's dependencies
- Create website using Ghost
- Download ghost-static-site-generator
- Automating the above process
The website looks as shown below:
Install Ghost locally and it's dependencies
- Install NodeJS. (v12 is the recommended for Ghost).
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash sudo apt install -y nodejs
- Install Yarn.
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add - echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list sudo apt update && sudo apt install yarn
- Install Ghost from source. (The official setup guide can be found here Note: Replace KushajveerSingh with your Github username.
git clone --recurse-submodules git@github.com:TryGhost/Ghost cd Ghost cd core/client cd ../../
-
This is a hack. If you follow the official setup guide then you would have forked the Ghost repo and added that as your upstream in the previous step.
I skipped that step, as I was having some problems with that. Instead I deleted the
.git
folder and initialized a new github repo for version control.So go the main Ghost folder and delete
.git
folder. Then go tocore/client
and delete the.git
folder and submodule file and you are done. - Install dependencies (We are in home directory of
Ghost
)sudo npm install sudo npm install -g knex-migrator knex-migrator i
- Make your Ghost folder a github repo.
- Goto Github and create a new repo where you want to store the
Ghost
folder. - In the
Ghost
folder run these commands to push it to github.
- Goto Github and create a new repo where you want to store the
Download ghost-static-site-generator
This is the tool that we will use to get a static site out of our Ghost site. You can check the official github repo of the package for more details on the usage.
To download the package run npm install -g ghost-static-site-generator
. If you get errors run this command again. I ran this command twice and it worked. Maybe try sudo
if it still not works.
Now you can create your static site using gssg --url=https://kushajveersingh.github.io/
and it will create a static
folder in your current directory, from where you can copy the contents to your .github.io
repo.
Automating the above process
To automate the complete process and ensure that my Ghost
repo and .github.io
repo are in sync, I created this script.
# Change git_folder, ghost_folder, url
# git_folder -> location of your .github.io repo
# ghost_folder -> location of the Ghost folder in which you are creating your site
# url -> The github address where your website will be published
git_folder="/home/kushaj/Desktop/Github/KushajveerSingh.github.io"
ghost_folder="/home/kushaj/Desktop/Github/Ghost"
url="https://kushajveersingh.github.io/"
# Remove all contents of git_folder
rm -r $git_folder/*
# Generate static site using ghost-static-site-generator
# The contents of the site are directly placed in the git_folder
gssg --url $url --dest $git_folder
# Commit the changes of git_folder
cd $git_folder
git add -A
git commit -m "$1"
git push origin master
# Commit the changes of ghost_folder
cd $ghost_folder
git add -A
git commit -m "$1"
git push origin master
You need to change only git_folder
, ghost_folder
and url as per your requirements.