辅助函数

辅助函数在模板中用于帮助您快速插入代码段。辅助函数不能在源文件中使用。

您可以轻松地编写自己的自定义辅助函数或使用我们现成的辅助函数。

URL

url_for

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

<%- url_for(path, [option]) %>
选项 描述 默认值
relative 输出相对链接 config.relative_link 的值

示例

_config.yml
root: /blog/ # example
<%- url_for('/a/path') %>
// /blog/a/path

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

_config.yml
relative_link: true
<%- url_for('/css/style.css') %>
// ../../css/style.css

/* Override option
* you could also disable it to output a non-relative link,
* even when `relative_link` is enabled and vice versa.
*/
<%- url_for('/css/style.css', {relative: false}) %>
// /css/style.css

relative_url

返回从 fromto 的相对 URL。

<%- relative_url(from, to) %>

示例

<%- relative_url('foo/bar/', 'css/style.css') %>
// ../../css/style.css

full_url_for

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

<%- full_url_for(path) %>

示例

_config.yml
url: https://example.com/blog # example
<%- full_url_for('/a/path') %>
// https://example.com/blog/a/path

gravatar

从电子邮件返回 Gravatar 图片 URL。

如果您没有指定 [options] 参数,则将应用默认选项。否则,您可以将其设置为一个数字,然后将其作为大小参数传递给 Gravatar。最后,如果您将其设置为一个对象,它将被转换为 Gravatar 参数的查询字符串。

<%- gravatar(email, [options]) %>
选项 描述 默认值
s 输出图片大小 80
d 默认图片
f 强制默认
r 评级

更多信息:Gravatar

示例

<%- gravatar('[email protected]') %>
// https://www.gravatar.com/avatar/b9b00e66c6b8a70f88c73cb6bdb06787

<%- gravatar('[email protected]', 40) %>
// https://www.gravatar.com/avatar/b9b00e66c6b8a70f88c73cb6bdb06787?s=40

<%- gravatar('[email protected]' {s: 40, d: 'https://via.placeholder.com/150'}) %>
// https://www.gravatar.com/avatar/b9b00e66c6b8a70f88c73cb6bdb06787?s=40&d=https%3A%2F%2Fvia.placeholder.com%2F150

HTML 标签

css

加载 CSS 文件。path 可以是字符串、数组、对象或对象数组。 /<root>/ 值会在 path 前添加,而 .css 扩展名会自动添加到 path 后面。使用对象类型以获取自定义属性。

<%- css(path, ...) %>

示例

<%- css('style.css') %>
// <link rel="stylesheet" href="/style.css">

<%- css(['style.css', 'screen.css']) %>
// <link rel="stylesheet" href="/style.css">
// <link rel="stylesheet" href="/screen.css">

<%- css({ href: 'style.css', integrity: 'foo' }) %>
// <link rel="stylesheet" href="/style.css" integrity="foo">

<%- css([{ href: 'style.css', integrity: 'foo' }, { href: 'screen.css', integrity: 'bar' }]) %>
// <link rel="stylesheet" href="/style.css" integrity="foo">
// <link rel="stylesheet" href="/screen.css" integrity="bar">

js

加载 JavaScript 文件。path 可以是字符串、数组、对象或对象数组。 /<root>/ 值会在 path 前添加,而 .js 扩展名会自动添加到 path 后面。使用对象类型以获取自定义属性。

<%- js(path, ...) %>

示例

<%- js('script.js') %>
// <script src="/script.js"></script>

<%- js(['script.js', 'gallery.js']) %>
// <script src="/script.js"></script>
// <script src="/gallery.js"></script>

<%- js({ src: 'script.js', integrity: 'foo', async: true }) %>
// <script src="/script.js" integrity="foo" async></script>

<%- js([{ src: 'script.js', integrity: 'foo' }, { src: 'gallery.js', integrity: 'bar' }]) %>
// <script src="/script.js" integrity="foo"></script>
// <script src="/gallery.js" integrity="bar"></script>

link_to

插入一个链接。

<%- link_to(path, [text], [options]) %>
选项 描述 默认值
external 在新标签页中打开链接 false
class 类名
id ID

示例

<%- link_to('http://www.google.com') %>
// <a href="http://www.google.com" title="http://www.google.com">http://www.google.com</a>

<%- link_to('http://www.google.com', 'Google') %>
// <a href="http://www.google.com" title="Google">Google</a>

<%- link_to('http://www.google.com', 'Google', {external: true}) %>
// <a href="http://www.google.com" title="Google" target="_blank" rel="noopener">Google</a>

mail_to

插入一个邮件链接。

<%- mail_to(path, [text], [options]) %>
选项 描述
class 类名
id ID
subject 邮件主题
cc 抄送
bcc 密送
body 邮件内容

示例

<%- mail_to('[email protected]') %>
// <a href="mailto:[email protected]" title="[email protected]">[email protected]</a>

<%- mail_to('[email protected]', 'Email') %>
// <a href="mailto:[email protected]" title="Email">Email</a>

image_tag

插入一个图片。

<%- image_tag(path, [options]) %>
选项 描述
alt 图片的替代文字
class 类名
id ID
width 图片宽度
height 图片高度

favicon_tag

插入一个网站图标。

<%- favicon_tag(path) %>

feed_tag

插入一个订阅链接。

<%- feed_tag(path, [options]) %>
选项 描述 默认值
title 订阅标题 config.title
type 订阅类型

示例

<%- feed_tag('atom.xml') %>
// <link rel="alternate" href="/atom.xml" title="Hexo" type="application/atom+xml">

<%- feed_tag('rss.xml', { title: 'RSS Feed', type: 'rss' }) %>
// <link rel="alternate" href="/atom.xml" title="RSS Feed" type="application/atom+xml">

/* Defaults to hexo-generator-feed's config if no argument */
<%- feed_tag() %>
// <link rel="alternate" href="/atom.xml" title="Hexo" type="application/atom+xml">

条件标签

is_current

检查 path 是否与当前页面的 URL 匹配。使用 strict 选项启用严格匹配。

<%- is_current(path, [strict]) %>

is_home

检查当前页面是否是首页。

<%- is_home() %>

is_home_first_page (+6.3.0)

检查当前页面是否是首页的第一页。

<%- is_home_first_page() %>

is_post

检查当前页面是否是文章。

<%- is_post() %>

is_page

检查当前页面是否是页面。

<%- is_page() %>

is_archive

检查当前页面是否是归档页面。

<%- is_archive() %>

is_year

检查当前页面是否是年份归档页面。

<%- is_year() %>

is_month

检查当前页面是否是月份归档页面。

<%- is_month() %>

is_category

检查当前页面是否是分类页面。
如果提供字符串作为参数,则检查当前页面是否与给定的分类匹配。

<%- is_category() %>
<%- is_category('hobby') %>

is_tag

检查当前页面是否是标签页面。
如果提供字符串作为参数,则检查当前页面是否与给定的标签匹配。

<%- is_tag() %>
<%- is_tag('hobby') %>

字符串操作

trim

删除字符串的前缀和尾部空格。

<%- trim(string) %>

strip_html

清理字符串中的所有 HTML 标签。

<%- strip_html(string) %>

示例

<%- strip_html('It\'s not <b>important</b> anymore!') %>
// It's not important anymore!

titlecase

将字符串转换为正确的标题大小写。

<%- titlecase(string) %>

示例

<%- titlecase('this is an apple') %>
# This is an Apple

markdown

使用 Markdown 渲染字符串。

<%- markdown(str) %>

示例

<%- markdown('make me **strong**') %>
// make me <strong>strong</strong>

render

渲染字符串。

<%- render(str, engine, [options]) %>

示例

<%- render('p(class="example") Test', 'pug'); %>
// <p class="example">Test</p>

有关详细信息,请参阅 渲染

word_wrap

将文本包装成不超过 length 的行。默认情况下,length 为 80。

<%- word_wrap(str, [length]) %>

示例

<%- word_wrap('Once upon a time', 8) %>
// Once upon\n a time

truncate

在特定 length 后截断文本。默认值为 30 个字符。

<%- truncate(text, [options]) %>

示例

<%- truncate('Once upon a time in a world far far away', {length: 17}) %>
// Once upon a ti...

<%- truncate('Once upon a time in a world far far away', {length: 17, separator: ' '}) %>
// Once upon a...

<%- truncate('And they found that many people were sleeping better.', {length: 25, omission: '... (continued)'}) %>
// And they f... (continued)

escape_html

转义字符串中的 HTML 实体。

<%- escape_html(str) %>

示例

<%- escape_html('<p>Hello "world".</p>') %>
// &lt;p&gt;Hello &quot;world&quot;.&lt;&#x2F;p&gt;

模板

partial

加载其他模板文件。您可以在 locals 中定义局部变量。

<%- partial(layout, [locals], [options]) %>
选项 描述 默认值
cache 缓存内容(使用片段缓存) false
only 严格局部变量。仅在模板中使用 locals 中设置的变量。 false

fragment_cache

缓存片段中的内容。它会保存片段内的内容,并在下次请求时提供缓存。

<%- fragment_cache(id, fn);

示例

<%- fragment_cache('header', function(){
return '<header></header>';
}) %>

日期和时间

date

插入格式化的日期。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。默认情况下,formatdate_format 设置。

<%- date(date, [format]) %>

示例

<%- date(Date.now()) %>
// 2013-01-01

<%- date(Date.now(), 'YYYY/M/D') %>
// Jan 1 2013

date_xml

以 XML 格式插入日期。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。

<%- date_xml(date) %>

示例

<%- date_xml(Date.now()) %>
// 2013-01-01T00:00:00.000Z

time

插入格式化的时间。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。默认情况下,formattime_format 设置。

<%- time(date, [format]) %>

示例

<%- time(Date.now()) %>
// 13:05:12

<%- time(Date.now(), 'h:mm:ss a') %>
// 1:05:12 pm

full_date

插入格式化的日期和时间。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。默认情况下,formatdate_format + time_format 设置。

<%- full_date(date, [format]) %>

示例

<%- full_date(new Date()) %>
// Jan 1, 2013 0:00:00

<%- full_date(new Date(), 'dddd, MMMM Do YYYY, h:mm:ss a') %>
// Tuesday, January 1st 2013, 12:00:00 am

relative_date

插入距离现在的相对时间。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。

<%- relative_date(date) %>

示例

<%- relative_date(new Date()) %>
// a few seconds ago

<%- relative_date(new Date(1000000000000)) %>
// 22 years ago

time_tag

插入时间标签。date 可以是 Unix 时间、ISO 字符串、日期对象或 Moment.js 对象。默认情况下,formatdate_format 设置。

<%- time_tag(date, [format]) %>

示例

<%- time_tag(new Date()) %>
// <time datetime="2024-01-22T06:35:31.108Z">2024-01-22</time>

<%- time_tag(new Date(), 'MMM-D-YYYY') %>
// <time datetime="2024-01-22T06:35:31.108Z">Jan-22-2024</time>

moment

Moment.js 库。

列表

list_categories

插入所有分类的列表。

<%- list_categories([options]) %>
选项 描述 默认值
orderby 分类的顺序 name
order 排序方式。1asc 表示升序;-1desc 表示降序 1
show_count 显示每个分类的文章数量 true
style 显示分类列表的样式。list 以无序列表形式显示分类。使用 false 或其他任何值将其禁用。 list
separator 分类之间的分隔符。(仅当 style 不是 list 时有效) ,
depth 要显示的分类级别。0 显示所有分类和子分类;-10 类似,但以扁平化方式显示;1 仅显示顶级分类。 0
class 分类列表的类名。 category
transform 更改分类名称显示方式的函数。
suffix 向链接添加后缀。

示例

<%- list_categories(post.categories, {
class: 'post-category',
transform(str) {
return titlecase(str);
}
}) %>

<%- list_categories(post.categories, {
class: 'post-category',
transform(str) {
return str.toUpperCase();
}
}) %>

list_tags

插入所有标签的列表。

<%- list_tags([options]) %>
选项 描述 默认值
orderby 标签的顺序 name
order 排序方式。1asc 表示升序;-1desc 表示降序 1
show_count 显示每个标签的文章数量 true
style 显示标签列表的样式。list 以无序列表形式显示标签。使用 false 或其他任何值将其禁用。 list
separator 分类之间的分隔符。(仅当 style 不是 list 时有效) ,
class 标签列表的类名(字符串)或自定义每个标签的类(对象,见下文)。 tag
transform 更改标签名称显示的函数。在list_categories中查看示例。
amount 要显示的标签数量(0 = 无限) 0
suffix 向链接添加后缀。

高级定制类

选项 描述 默认值
class.ul <ul> 类名(仅适用于 list 样式) tag-list (列表样式)
class.li <li> 类名(仅适用于 list 样式) tag-list-item (列表样式)
class.a <a> 类名 tag-list-link (列表样式) tag-link (普通样式)
class.label <span> 类名,标签名称存储在其中(仅适用于普通样式,当 class.label 设置时,标签将放在 <span> 中) tag-label (普通样式)
class.count <span> 类名,标签计数器存储在其中(仅当 show_counttrue 时) tag-list-count (列表样式) tag-count (普通样式)

示例

<%- list_tags(site.tags, {class: 'classtest', style: false, separator: ' | '}) %>
<%- list_tags(site.tags, {class: 'classtest', style: 'list'}) %>
<%- list_tags(site.tags, {class: {ul: 'ululul', li: 'lilili', a: 'aaa', count: 'ccc'}, style: false, separator: ' | '}) %>
<%- list_tags(site.tags, {class: {ul: 'ululul', li: 'lilili', a: 'aaa', count: 'ccc'}, style: 'list'}) %>

list_archives

插入归档列表。

<%- list_archives([options]) %>
选项 描述 默认值
type Type. 此值可以是 yearlymonthly monthly
order 排序方式。1asc 表示升序;-1desc 表示降序 1
show_count 显示每个归档的帖子数量 true
format 日期格式 MMMM YYYY
style 显示归档列表的样式。list 以无序列表形式显示归档。使用 false 或任何其他值来禁用它。 list
separator 归档之间的分隔符。(仅当 style 不是 list 时有效) ,
class 归档列表的类名。 archive
transform 更改归档名称显示的函数。在list_categories中查看示例。

list_posts

插入帖子列表。

<%- list_posts([options]) %>
选项 描述 默认值
orderby 帖子顺序 date
order 排序方式。1asc 表示升序;-1desc 表示降序 1
style 显示帖子列表的样式。list 以无序列表形式显示帖子。使用 false 或任何其他值来禁用它。 list
separator 帖子之间的分隔符。(仅当 style 不是 list 时有效) ,
class 帖子列表的类名。 post
amount 要显示的帖子数量(0 = 无限) 6
transform 更改帖子名称显示的函数。在list_categories中查看示例。

tagcloud

插入标签云。

<%- tagcloud([tags], [options]) %>
选项 描述 默认值
min_font 最小字体大小 10
max_font 最大字体大小 20
unit 字体大小单位 px
amount 标签总数 unlimited
orderby 标签的顺序 name
order 排序顺序。1asc 为升序;-1desc 为降序 1
color 为标签云着色 false
start_color 开始颜色。您可以使用十六进制 (#b700ff)、rgba (rgba(183, 0, 255, 1))、hsla (hsla(283, 100%, 50%, 1)) 或 颜色关键字。此选项仅在 color 为 true 时有效。
end_color 结束颜色。您可以使用十六进制 (#b700ff)、rgba (rgba(183, 0, 255, 1))、hsla (hsla(283, 100%, 50%, 1)) 或 颜色关键字。此选项仅在 color 为 true 时有效。
class 标签的类名前缀
level 不同类名的数量。此选项仅在 class 设置时有效。 10
show_count (+6.3.0) 显示每个标签的文章数量 false
count_class (+6.3.0) 标签计数的类名 count

示例

// Default options
<%- tagcloud() %>

// Limit number of tags to 30
<%- tagcloud({amount: 30}) %>

Miscellaneous

paginator

插入分页器。

<%- paginator(options) %>
选项 描述 默认值
base 基本 URL /
format URL 格式 page/%d/
total 页数 1
current 当前页码 0
prev_text 上一页的链接文本。仅在 prev_next 设置为 true 时有效。 Prev
next_text 下一页的链接文本。仅在 prev_next 设置为 true 时有效。 Next
space 空格文本 &hellp;
prev_next 显示上一页和下一页链接 true
end_size 开始和结束侧显示的页数 1
mid_size 当前页之间显示的页数,但不包括当前页 2
show_all 显示所有页面。如果此选项设置为 true,end_sizemid_size 将不起作用 false
escape 转义 HTML 标签 true
page_class (+6.3.0) 页面类名 page-number
current_class (+6.3.0) 当前页类名 current
space_class (+6.3.0) 空格类名 space
prev_class (+6.3.0) 上一页类名 extend prev
next_class (+6.3.0) 下一页类名 extend next
force_prev_next (+6.3.0) 强制显示上一页和下一页链接 false

示例

<%- paginator({
prev_text: '<',
next_text: '>'
}) %>
<!-- Rendered as -->
<a href="/1/">&lt;</a>
<a href="/1/">1</a>
2
<a href="/3/">3</a>
<a href="/3/">&gt;</a>
<%- paginator({
prev_text: '<i class="fa fa-angle-left"></i>',
next_text: '<i class="fa fa-angle-right"></i>',
escape: false
}) %>
<!-- Rendered as -->
<a href="/1/"><i class="fa fa-angle-left"></i></a>
<a href="/1/">1</a>
2
<a href="/3/">3</a>
<a href="/3/"><i class="fa fa-angle-right"></i></a>

search_form

插入 Google 搜索表单。

<%- search_form(options) %>
选项 描述 默认值
class 表单的类名 search-form
text 搜索提示词 Search
button 显示搜索按钮。该值可以是布尔值或字符串。如果该值为字符串,它将是按钮的文本。 false

number_format

格式化数字。

<%- number_format(number, [options]) %>
选项 描述 默认值
precision 数字的精度。该值可以是 false 或非负整数。 false
delimiter 千位分隔符 ,
separator 小数部分和小数部分之间的分隔符。 .

示例

<%- number_format(12345.67, {precision: 1}) %>
// 12,345.68

<%- number_format(12345.67, {precision: 4}) %>
// 12,345.6700

<%- number_format(12345.67, {precision: 0}) %>
// 12,345

<%- number_format(12345.67, {delimiter: ''}) %>
// 12345.67

<%- number_format(12345.67, {separator: '/'}) %>
// 12,345/67

meta_generator

插入generator 标签.

<%- meta_generator() %>

示例

<%- meta_generator() %>
// <meta name="generator" content="Hexo 4.0.0">

open_graph

插入Open Graph 数据。

<%- open_graph([options]) %>
选项 描述 默认值
title 页面标题 (og:title) page.title
type 页面类型 (og:type) article(帖子页面)
website(非帖子页面)
url 页面 URL (og:url) url
image 页面图片 (og:image) 内容中的所有图片
author 文章作者 (og:article:author) config.author
date 文章发布时间 (og:article:published_time) 页面发布时间
updated 文章修改时间 (og:article:modified_time) 页面修改时间
language 文章语言 (og:locale) page.lang || page.language || config.language
site_name 网站名称 (og:site_name) config.title
description 页面描述 (og:description) 页面摘要或内容的前 200 个字符
twitter_card Twitter 卡片类型 (twitter:card) summary
twitter_id Twitter ID (twitter:creator)
twitter_site Twitter 网站 (twitter:site)
twitter_image Twitter 图片 (twitter:image)
google_plus Google+ 个人资料链接
fb_admins Facebook 管理员 ID
fb_app_id Facebook 应用 ID

toc

解析内容中的所有标题标签 (h1~h6) 并插入目录。

<%- toc(str, [options]) %>
选项 描述 默认值
class 类名 toc
class_item (+6.3.0) 项目的类名 ${class}-item
class_link (+6.3.0) 链接的类名 ${class}-link
class_text (+6.3.0) 文本的类名 ${class}-text
class_child (+6.3.0) 子类的类名 ${class}-child
class_number (+6.3.0) 数字的类名 ${class}-number
class_level (+6.3.0) 级别的类名前缀 ${class}-level
list_number 显示列表编号 true
max_depth 生成目录的最大标题深度 6
min_depth 生成目录的最小标题深度 1
max_items (+7.3.0) 生成目录中项目的最大数量 Infinity

示例

<%- toc(page.content) %>

data-toc-unnumbered (+6.1.0)

具有属性 data-toc-unnumbered="true" 的标题将被标记为无编号(不会显示列表编号)。

警告!

要使用 data-toc-unnumbered="true",渲染器必须具有添加 CSS 类的选项。

请参阅以下 PR。