“[Hexo]利用GitHub搭建个人博客”

“这篇文章用来记录如何利用Hexo + github + 自定域名 来搭建自己的博客”

Posted by 郭伟 on 2019-05-26

这个由胡伟煌创作的胡玮煌主题改编自原来的波特玉轩

内容

郭伟博客 : 郭伟

Theme HuWeihuang

安装 Hexo

安装Node.js 和 Git

1
2
3
#Mac配置
brew install node
brew install git

安装 hexo

1
2
npm install hexo-cli -g
#更多信息 : https://hexo.io/zh-cn/index.html

主题配置

初始化


1
2
3
git clone https://github.com/testguowei/guowei.github.io.git
cd guowei.github.io.git
npm install

修改配置


使用你自己的信息来修改 _config.yml.
特别是部分:

部署

替换成你自己的repo!

1
2
3
4
deploy: 
type: git
repo: https://github.com/<yourAccount>/<repo> (例如:git@github.com:testguowei/guowei.github.io.git)
branch: <your-branch> (例如: master)

URL

如果将站点放在子目录中,请将url设置为http://your site.com/child,将root设置为/child/

1
2
url: http://www.helloblog.top/       #注意:不要忘记将CNAME文件修改为您的URL。 我的CNAME内容为: www.helloblog.top
root: /

侧边栏设置

复制你的头像到 <root>/img/ 并修改 _config.yml:

1
2
3
sidebar: true     #是否使用补充工具栏.
sidebar-about-description: “<你的描述>”
sidebar-avatar: img / <你的 头像 路径>

并激活你喜欢的个人小部件

1
2
3
4
5
6
7
widgets:         #这里是你可以使用的小工具,你可以注释掉
- featured-tags
- short-about
- recent-posts
- friends-blog
- archive
- category

如果你想添加侧边栏小部件,请添加layout/_widget.

签名设置

拷贝你的签名图片至 <root>/img/signature 并修改 _config.yml:

1
2
signature: true   # 显示签名
signature-img: img/signature/<your-signature-ID>

回到顶部图标设置

我这里使用的是钢铁侠, 你可以修改为自己的图标 css/image.

发布标签

您可以决定是否显示帖子标签.

1
home_posts_tag: true

home_posts_tag-true

Markdown render

我的Markdown render是hexo-renderer-markdown-it.

1
2
3
4
5
6
7
8
9
10
# Markdown-it config
## Docs: https://github.com/celsomiranda/hexo-renderer-markdown-it/wiki
markdown:
render:
html: true
xhtmlOut: false
breaks: true
linkify: true
typographer: true
quotes: '“”‘’'

如果你想改变标题锚’ℬ’,你可以去layout/post.ejs改变它

1
2
3
4
5
6
async("https://cdn.bootcss.com/anchor-js/1.1.1/anchor.min.js",function(){
anchors.options = {
visible: 'hover',
placement: 'left',
icon: ℬ // this is the header anchor "unicode" icon
};

Hexo Basics


一些Hexo的命令

1
2
3
4
hexo new post “<post name>”  #你可以将帖子更改为另一个布局如果你想要
hexo clean && hexo generate #generate static file
hexo server #rut hexo in local environment
hexo deploy #hexo会自动将静态文件推送到您的回购的特定分支(gh-pages)!

Github配置

创建Git仓库


git_create_repository
创建成功后需要跳转到Settings中修改GitHub Pages ,把Source中的None修改成master或者其他的分支.
git_select_page_branch

Git域名绑定

source/CNAME中添加你的域名:

1
www.helloblog.top   #这个是我在阿里注册的域名

域名解析设置

我这里使用的是阿里的.top的域名,我这里介绍如何设置解析.
ali_yuming_config