Hexo从0到1搭建博客系列03:文章与评论模块

简介: Hexo从0到1搭建博客系列03:文章与评论模块

Hexo从0到1搭建博客系列03:文章与评论模块

1. 文章的编辑与发布

在这一部分,我们主要学习如何编辑文章,并将其发布在Hexo博客上。

这一部分我们仍然在Hexo博客根目录上操作。

  1. 执行以下命令,创建一篇新的文章。引号内为博客的标题
hexo new ""
e.g.: hexo new "我的第一篇博客"
  1. 如图所示,该博客已经被创建到 source/_posts 目录下啦

image.png

  1. 编辑该页面,可以看到如下信息(可以采用 MarkText 进行编辑,这个是免费的)
---
title: 我的第一篇博客
date: 2022-10-05 16:00:30
tags:
---
  1. 其中包含了博客的 titledatetags信息
  2. 接下来,我们编辑博客的 tagscategories,仍然需要注意 yaml 格式
---
title: 我的第一篇博客
date: 2022-10-05 16:00:30
tags: [学习感悟, 知识分享, Java]
categories: [Java基础]
---
  1. 在下面接着编辑博客内容(可以采用 MarkText 进行编辑,这个是免费的)
    示例如下:
---
title: 我的第一篇博客
date: 2022-10-05 16:00:30
tags: [学习感悟, 知识分享, Java]
categories: [Java基础]
---
# 我的第一篇博客
## 1. Java基础
Java是一门后端语言,我爱Java。
## 2. Java实战
第一行代码
```java
System.out.println("Hello World!");
  1. Ctrl + S 保存,然后将博客运行到本地服务器。
hexo server

这样一来就可以完成博客的编辑与发布啦,看看成品吧~

下面那一篇是 Hexo 初始化的文章

image.png

进入 分类标签 页可以看到相应的内容

2. 引入评论模块

引入评论听起来非常高大上。如果自己手动搭建一个评论系统,将是需要一定技术的工作,而在Hexo-Fluid 中,这仅仅只是一个简单的配置

  1. 打开之前粘贴好的 _config.fluid.yml 文件,找到以下内容。
post:
  comments:
    enable: true
    type: disqus
  1. 这里我推荐使用另外一个评论插件 Valine,所以将type进行相应的更改。
post:
  comments:
    enable: true
    type: valine
  1. 其他评论插件官方文档有详细的写,如果想尝试其他的,请点击[这里](配置指南 | Hexo Fluid 用户手册)查找~
  2. 进入 Valine 主页,注册一个 LeanCloud 账号,然后完成相应的实名认证。这一部分就比较简单啦,不再赘述。
  3. 进入 LeanCloud 个人主页控制台,左上角创建应用。
    我已经创建过啦,就不再创建了。

image.png

  1. 点击进入创建好的应用,点击左侧菜单 设置 - 应用凭证,就可以看到相应的配置信息啦

image.png

  1. AppIDAppKey 复制并粘贴到 _config.fluid.yml 文件中如下相应的位置
valine:
  appId: xxxxx
  appKey: xxxxx
  1. 保存配置文件,再次运行博客到本地服务器
hexo server

打开之前发布的博客页,拉到最底部,即可看到评论界面啦~

image.png

由于 Valine 是一个无后端评论系统,想要管理评论的话,得去 LeanCloud 后台数据存储进行管理相关评论数据。

3. 后记

如果大家觉得我的内容写的还不错,可以在评论区留言支持一下呀~

欢迎大家来逛一逛我的个人博客~



相关文章
|
存储 对象存储 CDN
Hexo从0到1搭建博客系列04:图床的最佳实践
Hexo从0到1搭建博客系列04:图床的最佳实践
399 0
|
3月前
|
前端开发 搜索推荐 JavaScript
hexo本地部署-图文教程
关于Hexo本地部署的详细图文教程,介绍了如何安装Hexo、配置主题、创建页面以及进行个性化设置。
hexo本地部署-图文教程
|
域名解析 前端开发 Cloud Native
【阿里云开发】一键部署静态博客——Hexo
【阿里云开发】一键部署静态博客——Hexo
439 0
【阿里云开发】一键部署静态博客——Hexo
|
开发框架 资源调度 JavaScript
用Hexo搭建博客入门教程-搭建环境生成hexo静态页面(一)
用Hexo搭建博客入门教程-搭建环境生成hexo静态页面(一)
137 0
|
JavaScript 安全 前端开发
给Hexo添加说说功能
给Hexo添加说说功能
|
JavaScript Shell 网络安全
使用Hexo从0到1搭建个人博客详细教程(超详细,超简单)
使用Hexo从0到1搭建个人博客详细教程(超详细,超简单)
3345 1
|
SQL JavaScript 前端开发
Hexo从0到1搭建博客系列01:浅尝Hexo
Hexo从0到1搭建博客系列01:浅尝Hexo
130 0
|
JavaScript Ubuntu 网络安全
Hexo 个人博客搭建
hexo Github Pages博客搭建全过程 声明: 演示环境为Ubuntu 16.04,记录时间为16~17年。 创建仓库 !NOTE 目的是使用GitHub Pages来部署我们的博客。 注册GitHub账号,官网地址:https //github.com/ 登录后如下图,点击创建仓库
112 0
|
JavaScript 前端开发 Shell
Hexo系列(一) 搭建博客网站
Hexo系列(一) 搭建博客网站
160 0
|
JavaScript Linux 开发工具
Linux安装Hexo,打造个人博客
Linux安装Hexo,打造个人博客
Linux安装Hexo,打造个人博客
下一篇
DataWorks