Setup GitHub Pages with Ghost

To build your own static GitHub Pages using Ghost, just follow these steps.

Install Node.js

Ghost is written in Node.js, so you will need the Node.js runtime.

For OSX:

brew install node

For Linux distributions:
//blog.teamtreehouse.com/install-node-js-npm-linux

Download and Install Ghost

1. Download the latest release of Ghost
2. Unzip in the location you want to install
3. Fire up a terminal npm install --production
4. Start Ghost!
   Local environment: npm start
   On a server: npm start --production
5. Open http://localhost:2368/ghost
   Note: More install docs here in case you got stuck.

Start Ghost

npm start  

Login to Ghost

Open http://localhost:2368/ghost

Follows the initial step to create Ghost Blog Account.

Create your GitHub Pages repo

See the GitHub Pages Basics Documentation for details.

You must use the username/username.github.io naming scheme. The repo name must be lower case even if your username has upper case letters.

If you are using GitHub Pages domain for any other project

GitHub lets you host your static pages for free through GitHub Pages. Any repository you have on GitHub can be configured to provide a preview on the web. All you need to do is create a branch called gh-pages and your repository is accessible at username.github.io/repository-name, where you replace username and repository-name with their respective values.

Install Buster

With the tool Brute force static site generator for Ghost you can create static page for Ghost Blogs.

First we install Buster with:

pip install git+https://github.com/manthansharma/buster/  

Python is needed for install buster. (The latest versions of CentOS, Fedora, Redhat Enterprise (RHEL), Ubuntu and Ubuntu come with Python 2.x and 3.x out of the box.)

then for setting up static folder just makes a static/ directory and initializes a git repository inside it or use:

buster setup

Write Blog posts

Now your setup is complete and you can start writing Blog posts in Ghost and read the initial blog post how to edit with Markdown etc.

Export Ghost with Buster

All published blog posts could be exported to the static folder with Buster.

Fire up a terminal

buster generate --domain=https://codementor.io --web-url=YOUR_BLOG_URL  
buster preview  
open //localhost:9000

The output of Buster could be previewed on port 9000.

Deploy to GitHub Pages

buster deploy  

This will automatically add, commit and push all files in the static folder to your GitHub repo.

For the initial push, please wait up to 10 minutes until GitHub deploys your subdomain.

All upcoming pushes are much faster (but can take longer time) and you can see your static Ghost blog posts on https://username.github.io

Update or Add new Blog posts

To write new Blog posts or update the existing ones, just start Ghost, edit, then generate and deploy the static pages.

Fire up a terminal and run the following commands in your ghost blog directory.

npm start  
buster generate --domain=https://codementor.io --web-url=YOUR_BLOG_URL  
buster deploy  

Adding Comments to Your Static Pages

One downside of a static website is the inability to add comments. However, third-party services like Disqus only require you to insert a <script> tag, which gets you a comment box. Disqus recognises the URL from which the request is generated and automatically saves the comments to the relevant thread.

To insert the Disqus comment system on your static site, you need to insert it in the Ghost template, from which the static site is generated. Once you register with Disqus, you’ll be provided with a code snippet to insert on your site.

Find the file post.hbs in the theme directory in Ghost (typically /content/themes/[theme_name]/post.hbs) and paste it in between {{/post}} and </article>.

For more information, you could look at a detailed help page on Disqus regarding its installation on Ghost sites. If you have done this correctly, Disqus should appear on your local site, and Buster would extract it automatically.

That's it.