hexo个人博客的搭建

首先根据官网的步骤进行hexo的安装(安装hexo要先安装node.js和git)

hexo官网:文档 | Hexo

 

 安装完hexo包之后,执行下列命令,hexo 将会在指定文件夹中新建所需要的文件

hexo init blog
cd blog
npm install

blog就是文件夹的名称,可以按自己喜欢起名

 

 

接下来进行主题的安装

打开hexo的主题库,选择一个喜欢的主题

hexo主题库链接:Themes | Hexo

我选择的是比较流行的next

点击标题的位置

 往下拉会有安装命令,跟着步骤进行安装即可

 

 

现在我们来写一篇文章

在cmd中输入命令

hexo new "title"

这里的title就是文章标题

在source文件夹可以找到刚刚以title为标题的文章页面,已经自动生成了标题、日期,还可按需添加标签等页面属性

写入内容后,在cmd中输入以下命令生成网页

hexo g

再输入以下命令将页面运行起来

hexo s

打开链接即可看到刚才所写的内容

用以上类似命令还可以生成草稿页面(草稿页面不被主题渲染,但可以预览,草稿最终不被上传)

hexo new draft "draft title"

还有纯页面

hexo new page "page title"

 

scaffolds文件夹可以看到hexo自带的三个模板

我们也可以自定义其他模板,在source文件夹里,只要把new后面的名字换成你想要的模板名字就可以,如:

hexo new muban "muban title" 

如下图所示,模板创建好后能看到相应存放的路径

(模板使用的是Nunjucks语言)

 

Front Matter

在文章页面当中可以看到顶部有一部分被短划线包裹着,这一部分叫Front Matter

我们可以在里面进行一些插件的配置

如:

是否存在目录(on或者off)

给页面分类(分类使用的是Yaml语言)

不能直接使用1,2,会识别不出

 这些插件上网即可找到相应的安装代码

 

语言

在测试当中我发现我按照网上将站点配置中的language改成zh-Hans,页面出现的是不认识的文字

于是我打开next主题文件夹下的language文件夹,看到这里的中文文件叫做zh-CN

 于是我回到站点配置文件,将language改为zh-CN

此时刷新页面没有变化,按照以下方法进行重启

修改配置后如何重启

打开cmd输入以下命令清理一下hexo缓存

hexo clean

然后输入以下命令进行重启

hexo g && hexo s

刷新页面发现恢复简体中文

站点配置

在hexo官网的配置说明界面会告诉我们站点配置文件中的插件都是什么意思,我们该如何去配置它

首先来配置网站呈现出来的一些属性

根据介绍对代码进行修改

 

 重启网页后看到对比

注意!中国的时区只有以下5种,时区写成BeiJing的话,生成页面时会报错

Asia/Harbin

Asia/Shanghai

Asia/Chongqing

Asia/Urumqi

Asia/Kashgar

 

网址

 permalink 就是 网页的完整网址

官网给出了可添加的变量

值得注意的是,如果文章标题是中文的话,URL链接是也会是中文,复制后的链接是一长串,非常不利于阅读,也不简洁

使用文章ID的话,一旦执行hexo clean命令,ID也会被清除

为此我们可以使用 hexo-abbrlink 插件

输入以下命令进行安装

npm install hexo-abbrlink --save

然后在站点内配置以下内容

permalink: :year/:month/:day/post/:abbrlink.html

abbrlink:
  alg: crc32  # 算法:crc16(default) and crc32
  rep: hex    # 进制:dec(default) and hex

这时候重启页面就会发现网址自动生成了一个文章ID

并且当我们重新启动这个页面时,这个ID也不会改变

目录

 这部分一般不用修改

文章

 

分类&标签

 日期和格式

 

分页

 

posted @ 2024-02-06 16:58  Wild-bokeyuan  阅读(147)  评论(0)    收藏  举报