標籤外掛

標籤外掛與文章標籤不同。它們是從 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.dev.org.tw/#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 '連結到文章' %}

連結到文章

逸出標題。

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

不要逸出標題。

{% post_link hexo-4-released '<b>bold</b> custom title' false %}
粗體 自訂標題

包含資源

包含文章資源，與 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" />

標題 & Alt

{% 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 --> 標籤之前的文字作為文章的摘要。如果指定了 front-matter 中的 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.