NexT 主题高级标签插件

发表于 2025-09-11 阅读次数：本文字数： 2.1k 阅读时长 ≈ 2 分钟

Hexo NexT 主题提供了一系列的高级的标签插件，可以简单的实现一些复杂的功能。

按钮 Button

用法

{% button url, text, icon [class], [title] %}
{% btn url, text, icon [class], [title] %}

url: 绝对或相对路径的 URL
text: 按钮文本。如果未指定图标，则为必填项
icon: FontAwesome 图标。如果未指定文本，则为必填项
[class]: 可选参数; 默认 fa-fw; 可选: fa-fw | fa-lg | fa-2x | fa-3x | fa-4x | fa-5x
[title]: 可选参数; 鼠标悬停时提示

例子

{% button #, 按钮文本 %}

按钮文本

{% btn #, 按钮文本 %} {% btn #, 按钮文本 & 按钮标题,, 按钮标题 %}

按钮文本按钮文本 & 按钮标题

{% btn #,, home %}
{% btn #,, home fa-lg %}
{% btn #,, home fa-2x %}
{% btn #,, home fa-3x %}
{% btn #,, home fa-4x %}
{% btn #,, home fa-5x %}

{% btn #, 按钮文本, home %}

按钮文本

笔记 Note

设置

NexT _config.yml

# Note tag (bootstrap callout)
note:
  # Note tag style values:
  #  - simple    bootstrap callout old alert style. Default.
  #  - modern    bootstrap callout new (v2-v3) alert style.
  #  - flat      flat callout style with background, like on Mozilla or StackOverflow.
  #  - disabled  disable all CSS styles import of note tag.
  style: modern
  icons: false
  # Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).
  # Offset also applied to label tag variables. This option can work with disabled note tag.
  light_bg_offset: 0

用法

{% note [class] [no-icon] [summary] %}
笔记内容
{% endnote %}

[class]: 可选参数; 默认 default; 可选: default | primary | success | info | warning | danger
[no-icon]: 可选参数; 禁用 icon
[summary]: 可选参数; 笔记摘要

例子

default 样例

primary 样例

success 样例

info 样例

warning 样例

danger 样例

标签页 Tabs

设置

NexT _config.yml

# Tabs tag
tabs:
  # Make the nav bar of tabs with long content stick to the top.
  sticky: false
  transition:
    tabs: false
    labels: true

用法

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

Unique name: 当前页面下唯一名称
[index]: 活动标签页索引
[Tab caption]: 标签页标题
[@icon]: FontAwesome 图标

例子

左对齐列	右对齐列	居中列
11	12	13
21	22	23
31	32	33

#!/usr/bin/python
# -*- coding: UTF-8 -*-
 
def fib(n):
    a,b = 1,1
    for i in range(n-1):
        a,b = b,a+b
    return a

文本标签 Label

用法

{% label [class]@text %}

[class]: 可选参数; 默认 default; 可选: default | primary | success | info | warning | danger
text: 标签文本

例子

曲曲折折的荷塘上面，弥望旳是田田的叶子。叶子出水很高，像亭亭旳舞女旳裙。
层层的叶子中间，零星地点缀着些白花，有袅娜地开着旳，有羞涩地打着朵儿旳；正如一粒粒的明珠，又如碧天里的星星，又如刚出浴的美人。
微风过处，送来缕缕清香，仿佛远处高楼上渺茫的歌声似的。这时候叶子与花也有一丝的颤动，像闪电般，霎时传过荷塘的那边去了。
叶子本是肩并肩密密地挨着，这便宛然有了一道凝碧的波痕。叶子底下是脉脉的流水，遮住了，不能见一些颜色；而叶子却更见风致了。