Hexo搭建个人博客

第一步:Hexo

使用了Hexo脚手架。
首先找一个放置脚手架的目录,输入以下命令完成安装:

npm install hexo-cli -g
hexo init blog
cd blog
npm install

文件目录大致如下:

├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

-config.yml中是博客参数配置
scaffoles中是模板文件,可以修改文章的模板
source中是博客中的静态资源,这篇文章就是通过source/_posts目录下的md文档写的
themes中是主题样式,是编写博客样式的地方,可以自己编,也可以用现成的

然后就可以在配置文件-config.yml中绑定自己的域名。我用的是github.io,可以参考搭建免费个人博客详细教程进行配置。
绑定域名后就可以上传博客页面了。

下面是一些常用hexo命令:

hexo g          //生成项目
hexo s --debug  //本地调试(热更新)
hexo clean      //清除生成项目
hexo d          //部署项目

如果直接生成并部署项目,打开网页会看到Hexo提供的默认主题。主题存放于themes文件夹下,默认的主题名为landscape,文件夹名即为主题名,可在配置文件-config.ymltheme项中更改。但前提是themes目录下有其他的主题。

第二步:主题

说实话,Hexo默认的主题landscape就不错,简洁大气,但直接用默认主题就没意思了。GitHub上页有一些不错的主题模板,比如Next,星星是最高的,但感觉页面效果也没那么好,而且想用Next也有不少配置要学,索性自己从零开始搭建。

我的主题主要是仿照默认主题的结构编写。landscape主题目录下有languages、layout、scripts和source四个文件夹,languages存放语言配置文件,layout存放页面模板文件,scripts存放Hexo脚本,source存放页面样式、图片、字体等资源文件。

由于主题文件的编写是采用ejs模板引擎,所以如果没接触过ejs可能不好上手。可以参考从零开始制作Hexo主题进行编写。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章