三分钟教你搭建自己的个人网站-HEXO新建文章和页面

2024-04-20 16:53:10 3点赞 37收藏 0评论
三分钟教你搭建自己的个人网站-HEXO新建文章和页面

HEXO是一个开源纯静态的CMS内容管理系统,原生支持MarkDown语言,无需数据库,易部署和维护,可以免费托管到Github、Vercel以及Cloudflare等三方平台。我们可以用它来创建自己的个人站点。

下面我将用通俗易懂的语言让纯小白也能轻松搭建。该系列文章预计分为四期更新完成,分别为

1.HEXO的本地部署。

2.如何更新HEXO。

3.如何更换喜欢的主题。

4.如何将HEXO免费托管到三方平台。

本期为系列篇二,上次我们在本地部署了HEXO站点,那我们该如何更新网站的文章和页面呢?

HEXO的文章和页面的文件类型为md,也就是markdown的缩写。所以我们需要在电脑上安装支持markdown的编辑器,推荐使用notepad++,或是vscode。

文章文件存储在source_posts目录下,每个文章为一个独立的md文件。我们打开系统默认的文章看下结构:

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

打开.md文件我们可以看到顶部有两组(---)三个横杠包围起来的区域,这个区域是文章的matter区域,用来描述文章的标题、分类、标签、发布日期、甚至是封面图等信息。具体还支持哪些字段,取决于我们使用的主题支持哪些字段。

我们按照这个格式来新建一篇测试文章,如下图所示,然后保存到_posts目录下。

如果不想手动创建,也可以执行下面的命令来生成,然后再做编辑

hexo new blog test

执行完毕之后我们就生成了一个名为test的文件,接着我们用编辑器来编辑这个test文件。

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

接着我们在hexo文件夹下运行下面的部署命令来重新生成网站静态文件,然后发布演示站点。

hexo clean

hexo g

hexo s

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

最后我们打开浏览器localhost:4000看下我们发布的文章吧。

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

编辑页面也是类似的操作,有点不同的是,页面文件存储在source文件夹下,每个页面是一个独立的文件夹,文件夹里面的index.md是该页面的内容文件。

我们可以用下面的命令直接创建一个页面:

hexo new page about

这样我们就创建了一个名为about的页面。

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

简单编辑之后,我们再次执行上面的部署命令重新生成网页即可。

hexo clean

hexo g

hexo s

三分钟教你搭建自己的个人网站-HEXO新建文章和页面

如果你觉得我的内容对你有帮助,欢迎关注、转发、评论、点赞!

展开 收起
0评论

当前文章无评论,是时候发表评论了
提示信息

取消
确认
评论举报

相关文章推荐

更多精彩文章
更多精彩文章
最新文章 热门文章
37
扫一下,分享更方便,购买更轻松