Build up personal blog

2019-01-28

This post will show you how to build up a personal blog by node and hexo. Killy is responsible for building static pages. Laterly the blog will be hosted on Github.

Preliminaries

Before starting, you need: * node.js+npm

Get node.js from [here](https://pan.baidu.com/s/1kU5OCOB#list/path=%2Fpub%2Fnodejs). Check [here](https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/00143450141843488beddae2a1044cab5acb5125baf0882000) for more info of node.

hexo Install by npm:
1
$ npm install -g hexo-cli
git,
an account of Github,

and configure the ssh-key on your device.

Build blog

Initialize hexo with hexo

Create a local folder as your root directory, such as "blog", and go to the directory in your terminal and initialize it by hexo.

1 2	$ hexo init blog $ cd blog

Then initialize this directory with npm.

1 2	$ npm install $ hexo generate

Link hexo with Github

Set deployment tool,

1	$ npm install hexo-deployer-git --save

and initialize the remote repository for your blog on Github.

1
2
3

$ git init
$ git add *
$ git commit -m "init commit"

Change the deployment in file "_config.yml" like:

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy: 
    type: git 
    repo: git@github.com:jack/jack.github.io.git
    branch: master

Tips: The name of your hosting repository should be "[githubname].github.io", such as "jack.github.io". And mind the blankspaces while rewriting file "_config.yml". ### Generate static files Do it before you push it on Github.

1 2	$ hexo clean $ hexo generate

Deploy to remote sites

1	$ hexo deploy

see your pages

Click https://[githubname].github.io/, such as https://jack.github.io/.

Customization

change theme

I picked theme yilia. Configuration should be done as bellow:

1	> $ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

Change the default theme defined in "_config.yml" under root directory.

1	theme: yilia

upload your avatar

New a folder under the "source" directory, I named it assets. I also new the "img" folder for pictures. Put you avatar picture here. Then reconfigure the _config.yml file beneath theme "yilia"'s folder, which is:

1	avatar: /assets/img/avatar.jpg

classify your posts by categories rather than tags in default

Now take your eye away from file "_config.yml" under theme yilia, open the file "_config.yml" under the root directory of your blog. You need to configure category_map, for instance,

category_map:
  about: about
  notes: notes
  projects: projects
  papers: papers
  talks: talks
  meetings: meetings

Each pair of it can be different, it is just a mapping, such as:

1
2
3

category_map:
  parole: talks
  关于我: about

change the naming rule of a new post

The default naming rule of hexo is YYYY/MM/DD/[post name], which leads to a hyper-link without html suffix. I change it as html. It can be accomplished by configure the _config.yml in root directory.

1	permalink: posts/:category/:year-:month-:day-:title.html

Truncate the post in home list when it is too long.

You need to add

1	<!--more-->

after where you want to truncate in a post. And configure the __config.yml_ which is under themes' folder.

1 2	# The truncate signal while post is too long. excerpt_link: "more"

Support Latex

Check here for details.

Tips: if things don't work try restart, regenerate and redeploy.

Tips

You can debug pages locally by

$ hexo s

, which is convenient before deployment.

Acknowledgement

Thank Mauger, and litten.