hexo 操作指北

Hexo 搭建个人博客系列：写作技巧篇

Hexo内置标签

代码块

代码块进阶语法规则：

```
[language] [title] [url] [link text]
code snippet
```

增删行提示效果

 highlight:
   enable: true
   line_number: false
-  auto_detect: false
+  auto_detect: true
   tab_replace:

如果设置语言为 diff，可以在代码前添加 + 和 - 来使用如上所示的高亮增删行提示效果，在展示代码改动痕迹时比较实用。

note 标签

通过 note 标签可以为段落添加背景色，语法如下：

1
2
3

{% note [class] %}
文本内容 (支持行内标签)
{% endnote %}

支持的 class 种类包括 default primary success info warning danger，也可以不指定 class。

更多配置可在主题配置文件中设置

themes\next\_config.yml

note:
  # Note 标签样式预设
  style: modern  # simple | modern | flat | disabled
  icons: false  # 是否显示图标
  border_radius: 3  # 圆角半径
  light_bg_offset: 0  # 默认背景减淡效果，以百分比计算

tab 标签

tab 标签用于快速创建 tab 选项卡，语法如下

{% tabs [Unique name], [index] %}
  <!-- tab [Tab caption]@[icon] -->
  标签页内容（支持行内标签）
  <!-- endtab -->
{% endtabs %}

其中，各参数意义如下：

Unique name: 全局唯一的 Tab 名称，将作为各个标签页的 id 属性前缀
index: 当前激活的标签页索引，如果未定义则默认选中显示第一个标签页，如果设为 - 1 则默认隐藏所有标签页
Tab caption: 当前标签页的标题，如果不指定则会以 Unique name 加上索引作为标题
icon: 在标签页标题中添加 Font awesome 图标

使用示例如下：

{% tabs Tab标签列表 %}
  <!-- tab 标签页1 -->
    标签页1文本内容
  <!-- endtab -->
  <!-- tab 标签页2 -->
    标签页2文本内容
  <!-- endtab -->
  <!-- tab 标签页3 -->
    标签页3文本内容
  <!-- endtab -->
{% endtabs %}

引用站内链接

可以通过如下语法引入站内文章的地址或链接：

1 2	{% post_path slug %} {% post_link slug [title] %}

其中，slug 表示 _post 目录下的 Markdown 文件名。

post_path 标签将会渲染为文章的地址，即 permalink；而 post_link 标签将会渲染为链接，可以通过 title 指定链接标题。

插入 Swig 代码

如果需要在页面内插入 Swig 代码，包括原生 HTML 代码，JavaScript 脚本等，可以通过 raw 标签来禁止 Markdown 引擎渲染标签内的内容。语法如下：

1
2
3

{% raw %}
content
{% endraw %}

该标签通常用于在页面内引入三方脚本实现特殊功能，尤其是当该三方脚本尚无相关 hexo 插件支持的时候，可以通过写原生 Web 页面的形式引入脚本并编写实现逻辑。