您的当前位置:首页正文

从零搭建Hexo博客

来源:花图问答

前言

一直想搭建一个Next主题的Hexo博客,最近有点时间,肝吧!
目标是搭建出[Next作者大人那样的博客]


image.png

初始化工程

yarn global add hexo-cli
hexo init my-blog
cd my-blog
hexo server # 此时打开浏览器访问 localhost:4000 就可以看到默认主题了

下载Next主题

cd my-blog/themes
curl -O 
tar zxvf v5.1.3
mv hexo-theme-next-5.1.3 next
rm -f v5.1.3

修改Next主题

cd my-blog
vim themes/next/_config.yml
menu:       # menu里开启tag,archives
  home: / || home
  tags: /tags/ || tags
  archives: /archives/ || archive
auto_excerpt:   # 不现实全文
  enable: true  
  length: 150
scheme: Pisces  # 主题
avatar: /images/avatar.jpg  # 头像

写文章

cd my-blog
hexo new 从零搭建Hexo博客

执行完成后会发现 source/_posts 文件夹下会多出一个 从零搭建Hexo博客.md 在里面编辑内容即可。如果内容中有图片,将图片保存到 source/images 文件夹中,然后通过类似于 [图片上传失败...(image-7352e5-1512397796194)] 的方法访问它们。

开启标签功能

cd my-blog
hexo new page "tags"    # 创建tags页面
vim source/tags/index.md    # 编辑该页面
---
title: Tagcloud
date: 2017-12-04 21:40:21
type: "tags"
comments: false     # tags页面关闭标签功能
---

同时在 从零搭建Hexo博客.md 的头部写入 tags: [Hexo,NexT]
ps: 关于 tags 有个小坑,就是如果写错了 tag ,更正后,错误到 tag 不会被清除,此时需要执行 hexo clean 命令来清空错误到tag

部署

部署到 github page 上去

cd my-blog
yarn add hexo-deployer-git
vim _config.yml

编辑配置文件

deploy:
  type: git
  repo: 
  branch: 
  message: 

然后依次执行

hexo g  # 生成静态文件
hexo d  # 发布到 github page 上去

后续目标

  • 搜索服务
  • 评论功能
  • 阅读次数
  • live 2d.

参考链接