Instantly share code, notes, and snippets.

Embed
What would you like to do?
How to use Hexo and deploy to GitHub Pages

How to use Hexo and deploy to GitHub Pages

1. Install Hexo

$ sudo npm install -g hexo-cli

$ hexo -v
hexo-cli: 0.1.9
os: Darwin 14.3.0 darwin x64
http_parser: 2.3
node: 0.12.7
v8: 3.28.71.19
uv: 1.6.1
zlib: 1.2.8
modules: 14
openssl: 1.0.1p

2. Create a project for your GitHub Pages

$ hexo init yt8yt.github.io
INFO  Copying data to ~/***/yt8yt.github.io
INFO  You are almost done! Don't forget to run 'npm install' before you start blogging with Hexo!

$ cd yt8yt.github.io

$ npm install

3. Run a test server for your page on Mac

$ hexo server
INFO  Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.

4. Set information for your new blog

https://hexo.io/docs/configuration.html

$ vi _config.yml

~~~~~~~~~~~~~~~~~~ _config.yml ~~~~~~~~~~~~~~~~~~
# Site
title: yt8yt's note
subtitle:
description: yt8yt's personal blog
author: yt8yt
language:
timezone: Japan

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yt8yt.github.io/
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

5. Set information to use Git

https://github.com/hexojs/hexo-deployer-git

$ npm install hexo-deployer-git --save
$ vi _config.yml

~~~~~~~~~~~~~~~~~~ _config.yml ~~~~~~~~~~~~~~~~~~
# Deployment
## Docs: http://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:yt8yt/yt8yt.github.io.git
  branch: master

6. Set "watch" before starting your work

"watch" command can monitor your files.
https://hexo.io/docs/generating.html

$ hexo generate --watch

7. Create a new post file

$ hexo new first-post
INFO  Created: ~/***/yt8yt.github.io/source/_posts/first-post.md

8. Edit the above file with Markdown or Hexo's Helper

Hexo's Helper
https://hexo.io/docs/helpers.html
I use Atom with "shift + control + m" when I use Markdown :-)
https://atom.io/

9. Delete "source/_posts/hello-world.md"

It's not necessary to deploy.

10. Deploy your new blog!!

https://hexo.io/docs/deployment.html

$ hexo clean
$ hexo deploy

After writting the above command, you can see your new blog on GitHub Pages.
http://******.github.io/

11. Change your blog theme

https://github.com/hexojs/hexo/wiki/Themes

For instance, How to use the following theme.
https://hexo.io/hexo-theme-light/

## Install it
$ cd yt8yt.github.io
$ git clone git://github.com/tommy351/hexo-theme-light.git themes/light

## Update the above files
$ themes/light
$ git pull

## Set information to use the theme
$ cd yt8yt.github.io
$ vi _config.yml

~~~~~~~~~~~~~~~~~~ _config.yml ~~~~~~~~~~~~~~~~~~
# Extensions
## Plugins: http://hexo.io/plugins/
## Themes: http://hexo.io/themes/
theme: light

12. Create a new page file

https://hexo.io/docs/writing.html

$ hexo new page aboutme
INFO  Created: ~/***/yt8yt.github.io/source/aboutme/index.md

$ cd source/aboutme/

$ vi index.md

13. Use "Read More"

Write <!-- more --> in your articles.

14. Use Plugins

https://github.com/hexojs/hexo/wiki/Plugins

@aginanjar

This comment has been minimized.

aginanjar commented Mar 21, 2017

Awesome, thanks for sharing. (y)

@thirdgen88

This comment has been minimized.

thirdgen88 commented May 5, 2017

Agreed, covers all the aspects you need! Thanks!

@karthikkrishnadev

This comment has been minimized.

karthikkrishnadev commented May 15, 2017

Thank you so much! Works like a charm.

@CodeCanna

This comment has been minimized.

CodeCanna commented May 28, 2017

Okay its not working for me...I must have missed something somewhere. I followed the directions but its not working. I commited and pushed the files to github the traditional way prior to finding these instructions, should I clean out the repo and try again?

@shengyu

This comment has been minimized.

shengyu commented Jun 5, 2017

Thanks for sharing, it's really helpful.

@branko333

This comment has been minimized.

branko333 commented Jun 18, 2017

Thanks!

@gnehz972

This comment has been minimized.

gnehz972 commented Jun 28, 2017

best hexo & github page tutorial

@agonzalez0515

This comment has been minimized.

agonzalez0515 commented Jul 8, 2017

This is so good! First time using Hexo and this made it so easy.

@KINGSABRI

This comment has been minimized.

KINGSABRI commented Aug 21, 2017

Install nodejs, nvm on ubuntu

Install required packages for nodejs

apt update
apt install build-essential libssl-dev
apt install nodejs
apt install npm

Install nvm

wget -qO- https://raw.githubusercontent.com/creationix/nvm/master/install.sh | bash 

Install latest stable nodejs version

nvm install stable

update your profile - to find nvm path

source ~/.profile

Install hexo

npm install -g hexo-cli

Sources

@triyanarief

This comment has been minimized.

triyanarief commented Oct 11, 2017

thanks dude!

@wangjuanmt

This comment has been minimized.

wangjuanmt commented Nov 28, 2017

Thanks, it's very useful!

@HelloWhist

This comment has been minimized.

HelloWhist commented Jan 10, 2018

thx

@BobHongYuChen

This comment has been minimized.

BobHongYuChen commented Jan 24, 2018

thx

@ziyoushibo

This comment has been minimized.

ziyoushibo commented Mar 22, 2018

no ssh?

@fer

This comment has been minimized.

fer commented Apr 10, 2018

Good stuff! Maybe worth to mention to add a CNAME under sources in order to use a custom domain.

@garyyu

This comment has been minimized.

garyyu commented Apr 25, 2018

Nice and simple HowTo document~ Thanks!

@strongSoda

This comment has been minimized.

strongSoda commented Jun 29, 2018

vi _config.yml not working. Says vi is not an internal or external command

@ohkimchi

This comment has been minimized.

ohkimchi commented Jul 15, 2018

Thank you so much, buddy!

@initialkommit

This comment has been minimized.

initialkommit commented Jul 29, 2018

Thank you. It's useful!

@ghost

This comment has been minimized.

ghost commented Aug 11, 2018

i changed my theme, my theme apply in local but i cannot reflect it to github page :((( even deploy many times

@Jonnypeng

This comment has been minimized.

Jonnypeng commented Oct 15, 2018

thank you.it's useful!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment