Other Posts

Know How to Build github.io Blog in 3 min?

I write this tutorial with some notes about how to build a github.io blog, because I was struggling a bit on it (well, I’m a dummy). Hope this post will give you a clear view and make you enjoy the build-up phrase. Then after that, you could waste some of your time on customizing your own awesome blog. 😉

(What about 3 min? It’s the time to read this post…)

STEP 0: Know things first

  • GitHub account: If you don’t have one, what are you waiting for? Just get one ;)
  • GitHub Pages: It’s designed to host your personal, organization, or project pages directly from a GitHub repository.
  • Jeykll: It transfers plain text into static websites and blogs.

STEP 1: Why?

  • It’s really simple, compared to WordPress
  • It’s interesting to write post with Markdown ^^
  • You will tell me… 😄

STEP 2: Pick theme

  • A list of some nice jekyll themes
  • Check theme demos and pick favorite one
  • Open GitHub and check source page ☕

STEP 3: Fork-it

  • Fork the theme repository to your username.github.io, where username is your own username on GitHub. (#Eg: my repository for this blog is kevcui.github.io)
  • Clone it to your local
~ $ git clone https://github.com/username/username.github.io my-blog

STEP 4: Configure-it

  • Go to my-blog
~ $ cd my-blog
  • Open _config.yml and modify
title: 'your-blog-title'
description: 'your-blog-description'
url: 'https://username.github.io'
baseurl: '/'
gems : ['jekyull-paginate', 'jemoji']

⚠️ Empty baseurl or change it to / depends on theme. Otherwise, some themes may not work correctly.
👊 jemoji!

STEP 5: Test-it

  • Run locally
~ $ cd my-blog
~ $ jekyll serve
# => Now browse to http://localhost:4000/

STEP 6: Post-it

  • Create a post in _post, name it YEAR-MONTH-DAY-title.md
title: "How to build github.io blog in 3 min?"
date:  2016-11-18 23:25:28 +0200

⚠️ Be careful of date format YYYY-MM-DD HH:MM:SS +/-TTTT, TTTT is timezone offset

STEP 7: Publish-it