标签插件

标签插件与文章标签不同。它们移植自 Octopress,为您提供了一种快速向文章添加特定内容的便捷方式。

虽然您可以使用任何格式编写文章,但标签插件始终可用,语法保持一致。

标签插件不应该包装在 Markdown 语法内,例如 []({% post_path lorem-ipsum %}) 不支持。

块引用

非常适合在文章中添加引用,可以选择添加作者、来源和标题信息。

别名: quote

{% blockquote [author[, source]] [link] [source_link_title] %}
content
{% endblockquote %}

示例

无参数。普通块引用。

{% blockquote %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat. Sed nec tempor elit, quis aliquam neque. Curabitur sed diam eget dolor fermentum semper at eu lorem.
{% endblockquote %}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat. Sed nec tempor elit, quis aliquam neque. Curabitur sed diam eget dolor fermentum semper at eu lorem.

来自书籍的引用

{% blockquote David Levithan, Wide Awake %}
Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy.
{% endblockquote %}

不要只为自己寻求幸福。为所有的人寻求幸福。通过仁慈。通过怜悯。

David LevithanWide Awake

来自 Twitter 的引用

{% blockquote @DevDocs https://twitter.com/devdocs/status/356095192085962752 %}
NEW: DevDocs now comes with syntax highlighting. http://devdocs.io
{% endblockquote %}

新功能:DevDocs 现在支持语法高亮。 http://devdocs.io

来自网络文章的引用

{% blockquote Seth Godin http://sethgodin.typepad.com/seths_blog/2009/07/welcome-to-island-marketing.html Welcome to Island Marketing %}
Every interaction is both precious and an opportunity to delight.
{% endblockquote %}

每一次互动都是珍贵的,也是带来喜悦的机会。

代码块

一个在文章中添加代码片段的有用功能。

别名: code

{% codeblock [title] [lang:language] [url] [link text] [additional options] %}
code snippet
{% endcodeblock %}

option:value 的格式指定附加选项,例如 line_number:false first_line:5

附加选项 描述 默认值
line_number 显示行号 true
line_threshold 仅当代码块的行数超过此阈值时才显示行号。 0
highlight 启用代码高亮 true
first_line 指定首行行号 1
mark 高亮特定行,每个值用逗号隔开。使用连字符指定数字范围
示例:mark:1,4-7,10 将高亮第 1 行、第 4 到 7 行以及第 10 行。
wrap 将代码块包装在 <table> true

示例

一个普通的代码块

{% codeblock %}
alert('Hello World!');
{% endcodeblock %}
alert('Hello World!');

指定语言

{% codeblock lang:objc %}
[rectangle setX: 10 y: 10 width: 20 height: 20];
{% endcodeblock %}
[rectangle setX: 10 y: 10 width: 20 height: 20];

在代码块中添加标题

{% codeblock Array.map %}
array.map(callback[, thisArg])
{% endcodeblock %}
Array.map
array.map(callback[, thisArg])

添加标题和 URL

{% codeblock _.compact https://underscorejs.node.org.cn/#compact Underscore.js %}
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
{% endcodeblock %}
_.compactUnderscore.js
\_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]

反引号代码块

这与使用代码块相同,只是使用三个反引号来分隔代码块。

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

长引用

在文章中添加长引用

{% pullquote [class] %}
content
{% endpullquote %}

jsFiddle(已在 v7.0.0 中删除)

该标签已在 Hexo 7.0.0 中删除。我们提供了一个插件 hexo-tag-embed 用于向后兼容您的现有文章。

嵌入 jsFiddle 代码片段

{% jsfiddle shorttag [tabs] [skin] [width] [height] %}

Gist(已在 v7.0.0 中删除)

如果您使用 v7.0.0+,请使用 hexo-tag-embed 代替。

嵌入 Gist 代码片段

{% gist gist_id [filename] %}

iframe

嵌入 iframe

{% iframe url [width] [height] %}

图片

插入指定大小的图片。

{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %}

链接

插入带有 target="_blank" 属性的链接。

{% link text url [external] [title] %}

包含代码

插入 source/downloads/code 文件夹中的代码片段。文件夹位置可以通过配置文件中的 code_dir 选项指定。

{% include_code [title] [lang:language] [from:line] [to:line] path/to/file %}

示例

嵌入 test.js 的全部内容

{% include_code lang:javascript test.js %}

仅嵌入第 3 行

{% include_code lang:javascript from:3 to:3 test.js %}

嵌入第 5 到 8 行

{% include_code lang:javascript from:5 to:8 test.js %}

嵌入第 5 行到文件末尾

{% include_code lang:javascript from:5 test.js %}

嵌入第 1 到 8 行

{% include_code lang:javascript to:8 test.js %}

YouTube(已在 v7.0.0 中删除)

如果您使用 v7.0.0+,请使用 hexo-tag-embed 代替。

插入 YouTube 视频。

{% youtube video_id [type] [cookie] %}

示例

嵌入视频

{% youtube lJIrF4YjHfQ %}

嵌入播放列表

{% youtube PL9hW1uS6HUfscJ9DHkOSoOX45MjXduUxo 'playlist' %}

启用隐私增强模式

在这种模式下不会使用 YouTube 的 cookie。

{% youtube lJIrF4YjHfQ false %}
{% youtube PL9hW1uS6HUfscJ9DHkOSoOX45MjXduUxo 'playlist' false %}

Vimeo(已在 v7.0.0 中删除)

如果您使用 v7.0.0+,请使用 hexo-tag-embed 代替。

插入自适应或指定大小的 Vimeo 视频。

{% vimeo video_id [width] [height] %}

包含文章

包含指向其他文章的链接。

{% post_path filename %}
{% post_link filename [title] [escape] %}

使用此标签时,您可以忽略永久链接和文件夹信息,例如语言和日期。

例如:{% post_link how-to-bake-a-cake %}

只要文章文件名是 how-to-bake-a-cake.md,即使文章位于 source/posts/2015-02-my-family-holiday 并具有永久链接 2018/en/how-to-bake-a-cake,这也会生效。

您可以自定义显示的文本,而不是显示文章的标题。

默认情况下,文章标题和自定义文本都会被转义。您可以使用 escape 选项来禁用转义。

例如

显示文章标题。

{% post_link hexo-3-8-released %}

Hexo 3.8.0 发布

显示自定义文本。

{% post_link hexo-3-8-released 'Link to a post' %}

Link to a post

转义标题。

{% post_link hexo-4-released 'How to use <b> tag in title' %}
如何在标题中使用 <b> 标签

不转义标题。

{% post_link hexo-4-released '<b>bold</b> custom title' false %}
bold custom title

包含资源

包含文章资源,与 post_asset_folder 结合使用。

{% asset_path filename %}
{% asset_img [class names] slug [width] [height] [title text [alt text]] %}
{% asset_link filename [title] [escape] %}

嵌入图片

hexo-renderer-marked 3.1.0+ 可以(可选)自动解析图片的文章路径,请参考 此节 了解如何启用它。

“foo.jpg” 位于 http://example.com/2020/01/02/hello/foo.jpg

默认(无选项)

{% asset_img foo.jpg %}

<img src="/2020/01/02/hello/foo.jpg" />

自定义类

{% asset_img post-image foo.jpg %}

<img src="/2020/01/02/hello/foo.jpg" class="post-image" />

显示大小

{% asset_img foo.jpg 500 400 %}

<img src="/2020/01/02/hello/foo.jpg" width="500" height="400" />

标题和替代文本

{% asset_img foo.jpg "lorem ipsum'dolor'" %}

<img src="/2020/01/02/hello/foo.jpg" title="lorem ipsum" alt="dolor" />

URL

url_for (7.0.0+)

返回一个以根路径为前缀的 URL。输出会自动编码。

{% url_for text path [relative] %}

示例

_config.yml
root: /blog/ # example
{% url_for blog index.html %}
<a href="/blog/index.html">blog</a>

相对链接,默认情况下遵循 relative_link 选项
例如,文章/页面路径是 ‘/foo/bar/index.html’

_config.yml
relative_link: true
{% url_for blog index.html %}
<a href="../../index.html">blog</a>

您也可以禁用它来输出非相对链接,即使 relative_link 已启用,反之亦然。

{% url_for blog index.html false %}
<a href="/index.html">blog</a>

full_url_for (7.0.0+)

返回一个以 config.url 为前缀的 URL。输出会自动编码。

{% full_url_for text path %}

示例

_config.yml
url: https://example.com/blog # example
{% full_url_for index /a/path %}
<a href="https://example.com/blog/a/path">index</a>

原始

如果某些内容在您的文章中造成处理问题,请用 raw 标签将其包装起来,以避免渲染错误。

{% raw %}
content
{% endraw %}

文章摘录

使用 <!-- more --> 标签之前放置的文本作为文章的摘录。如果指定了 前置内容 中的 excerpt: 值,则它将优先使用。

示例

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<!-- more -->
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.