Hexo系列(五) 撰写文章

在利用 Hexo 框架搭建一个属于咱们本身的博客网站后，下面咱们就来谈谈怎样在网站上书写咱们的第一篇博客吧

1、建立文章

在站点文件夹中打开 git bash，输入以下命令建立文章，其中 title 为文章的标题

$ hexo new "title"

当输入命令后，就会在 source/_post 文件夹下建立一个文件，命名为：title.md

这个文件就是将要发布到网站上的原始文件，用于记录文章内容

下面，咱们将要在这个文件中写下咱们的第一篇博客

2、编写文章（基于 Markdown）

一、Markdown 简介

可是，在咱们正式写下第一个文字前，咱们须要了解一下究竟什么是 Markdown？

Markdown 是一种可使用普通文本编辑器编写的 标记语言，经过简单的 标记语法，它可使普通文本内容具备必定的格式

基于 Markdown 语法的简洁性，它已经成为目前世界上最流行的用于书写博客的语言

二、Markdown 语法

在编写 Markdown 时，博主强烈的推荐给你们一款简洁易用的 Markdown 编辑器 —— Typora

按照官方的说法就是 简单而强大，它不只支持原生的语法，也支持对应的快捷键，更重要的是它还能够 实时预览

这里附上 Typora 的下载地址：https://www.typora.io/，有兴趣的朋友能够下载来试试

好，下面开始进入正题，介绍一些经常使用的 Markdown 语法

（1）标题

Markdown 语法：

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

Typora 快捷键：

Ctrl+1：一级标题

Ctrl+2：二级标题

Ctrl+3：三级标题

Ctrl+4：四级标题

Ctrl+5：五级标题

Ctrl+6 ：六级标题

Ctrl+0：段落

（2）粗体、斜体、删除线和下划线

Markdown 语法：

*斜体*
**粗体**
***加粗斜体***
~~删除线~~

Typora 快捷键：

Ctrl+I：斜体

Ctrl+B：粗体

Ctrl+U：下划线

Alt+Shift+5：删除线

（3）引用块

Markdown 语法：

> 文字引用

Typora 快捷键： Ctrl+Shift+Q

（4）代码块

Markdown 语法：

`行内代码`

​```
多行代码
多行代码
​```

Typora 快捷键：

行内代码：Ctrl+Shift+`

多行代码：Ctrl+Shift+K

（5）公式块

Markdown 语法：

$$
数学公式
$$

Typora 快捷键： Ctrl+Shift+M

（6）分割线

Markdown 语法：

方法一：---

方法二：+++

方法三：***

（7）列表

Markdown 语法：

1. 有序列表项

* 无序列表项

+ 无序列表项

- 无序列表项

Typora 快捷键：

有序列表项：Ctrl+Shift+[

无序列表项：Ctrl+Shift+]

（8）表格

Markdown 语法：

表头1|表头2
-|-|-
内容11|内容12
内容21|内容22

Typora 快捷键： Ctrl+T

（9）超连接

Markdown语法：

方法一：[连接文字](连接地址 "连接描述")
例如：[示例连接](https://www.example.com/ "示例连接")

方法二：<连接地址>
例如：<https://www.example.com/>

Typora快捷键： Ctrl+K

（10）图片

Markdown语法：

![图片文字](图片地址 "图片描述")
例如：![示例图片](https://www.example.com/example.PNG "示例图片")

Typora快捷键： Ctrl+Shift+I

说明：在 Hexo中 插入图片时，请按照如下的步骤进行设置

1. 将 站点配置文件 中的 post_asset_folder 选项的值设置为 true

2. 在站点文件夹中打开 git bash，输入命令 npm install hexo-asset-image --save 安装插件

3. 这样，当使用 hexo new title 建立文章时，将同时在 source/_post 文件夹中生成一个与 title 同名的文件夹，咱们只需将图片放进此文件夹中，而后在文章中经过 Markdown 语法进行引用便可

   例如，在资源文件夹（就是那个与 title 同名的文件夹）中添加图片 example.PNG，则能够在对应的文章中使用语句 ![示例图片](title/example.PNG "示例图片") 添加图片

三、高级设置

（1）模板设置

当咱们使用命令 hexo new "title" 建立文章时，Hexo 会根据 /scaffolds/post.md 对新文章进行初始化

换言之，/scaffolds/post.md 就是新文章的 模板，因此咱们能够修改它来适应本身的写做习惯

一个简单的示例以下：

title: {{ title }}
date: {{ date }}
tags: 
categories:

（2）头部设置

在每篇利用 Hexo 建立的文章的开头，都会有对文章进行说明的文字，叫作 文章头部

文章的头部除了能够设置文章标题、发布日期等基础信息外，还能够为文章添加标签、分类等

一个简单的示例以下：

title: Title
date: YYYY-MM-DD HH:MM:SS
tags: [tag1, tag2, ...]
categories: category

注意：属性和属性值之间必须有一个空格，不然会解析错误

（3）首页显示

在利用 Hexo 框架搭建的博客网站中，首页会显示文章的内容，且默认显示文章的所有内容

若是当文章太长的时候就会显得十分冗余，因此咱们有必要对其进行精简

这时，咱们只需在文章中使用 <!--more--> 标志便可，表示只会显示标志前面的内容

3、部署发布

在站点文件夹中打开 git bash，输入以下命令部署和发布文章

$ hexo g -d

建议：在使用 hexo g 部署以后，能够先使用 hexo s 运行本地站点，而后在浏览器输入地址 http://lacolhost:4000/ 查看运行结果，检查无误后再使用 hexo d 发布

【Hexo系列相关文章】

• Hexo系列(一) 搭建博客网站

• Hexo系列(二) 配置文件详解

• Hexo系列(三) 经常使用命令详解

• Hexo系列(四) NexT主题配置

• Hexo系列(五) 撰写文章