惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

U
Unit 42
罗磊的独立博客
爱范儿
爱范儿
Apple Machine Learning Research
Apple Machine Learning Research
S
Schneier on Security
V
Vulnerabilities – Threatpost
T
Tenable Blog
博客园 - 【当耐特】
博客园 - 聂微东
I
Intezer
S
Securelist
C
Cisco Blogs
腾讯CDC
T
The Exploit Database - CXSecurity.com
NISL@THU
NISL@THU
P
Proofpoint News Feed
Cyberwarzone
Cyberwarzone
Security Archives - TechRepublic
Security Archives - TechRepublic
D
Darknet – Hacking Tools, Hacker News & Cyber Security
美团技术团队
P
Proofpoint News Feed
M
MIT News - Artificial intelligence
AWS News Blog
AWS News Blog
A
About on SuperTechFans
Last Week in AI
Last Week in AI
Cloudbric
Cloudbric
S
Secure Thoughts
PCI Perspectives
PCI Perspectives
The Last Watchdog
The Last Watchdog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
B
Blog RSS Feed
Recorded Future
Recorded Future
大猫的无限游戏
大猫的无限游戏
C
CERT Recently Published Vulnerability Notes
酷 壳 – CoolShell
酷 壳 – CoolShell
G
Google Developers Blog
The Register - Security
The Register - Security
博客园 - 叶小钗
博客园 - 司徒正美
博客园_首页
Google DeepMind News
Google DeepMind News
Hacker News: Ask HN
Hacker News: Ask HN
Spread Privacy
Spread Privacy
雷峰网
雷峰网
I
InfoQ
The Hacker News
The Hacker News
T
Threat Research - Cisco Blogs
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Schneier on Security
Schneier on Security
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻

Icarus

Getting Started with Icarus Icarus User Guide - Configuring the Theme FAQ Cyberpunk Theme Variant Upgrade Guide Custom Hexo Tag Helpers Hexo Built-in Tag Helpers Icarus User Guide - CDN Providers Icarus User Guide - Comment Plugins Icarus User Guide - Donation Buttons Icarus User Guide - Other Plugins Icarus User Guide - Share Buttons Icarus User Guide - Search Plugin Icarus User Guide - Web Analytics Plugins Icarus User Guide - Widgets Icarus快速上手 Icarus用户指南 - 主题配置 常见问题 升级指南
自定义Hexo标签插件
PPOffice · 2018-01-02 · via Icarus

除了Hexo Built-in Tag Helpers中描述的Hexo原生支持的标签插件以外,Icarus也提供其他 几个用来定制内容显示的有用的标签插件。

消息

五颜六色的消息块可以用来强调你文章中的部分文本。 它的语法定义如下:

1
2
3
{% message color:<颜色> size:<大小> icon:<图标> title:<标题> %}
<内容>
{% endmessage %}

color

此选项定义消息块的颜色。 其为可选项。 它可用的配置值与示例如下:

一个没有设置颜色的代码块。

一个深色(dark)的代码块。

一个主题色(primary)的代码块。

一个提示色(info)的代码块。

一个成功色(success)的代码块。

一个警示色(warning)的代码块。

一个危险色(danger)的代码块。

size

此选项定义消息块的大小。 其为可选项。 它可用的配置值与示例如下:

一个小(small)的代码块。

一个没有设置大小的代码块。

一个中等大小(small)的代码块。

一个大(small)的代码块。

icon

此选项定义显示在消息块头部的图标。 其为可选项。 它的值应为FontAwesome的图标class name。 如果图标的class name含有空格,则配置名与配置值需要用引号包裹住。

一个有着GitHub图标("icon:fa-brands fa-github")的消息块。

一个有着Node.js图标("icon:fa-brands fa-node-js")的消息块。

一个有着NPM图标("icon:fa-brands fa-npm")的消息块。

title

此选项定义消息块的标题。 其为可选项。 如果标题含有空格,则配置名与配置值需要用引号包裹住。

有标题的消息块("title:有标题的消息块")。

没有标题的消息块。

没有标题的消息块。

没有标题的消息块。

没有标题的消息块。

没有标题的消息块。

没有标题的消息块。

没有标题的消息块。

标签页

标签页是一个功能强大的用于展示平行内容的标签插件。 同一时间内,只有活动的标签页内容才能展示给用户。 它的语法定义如下:

1
2
3
4
5
6
7
8
9
{% tabs size:<大小> align:<对齐> style:<样式> %}
<!-- tab id:<标签ID> icon:<图标> title:<标签标题> active -->
<标签内容>
<!-- endtab -->
<!-- tab id:<标签ID> icon:<图标> title:<标签标题> -->
<标签内容>
<!-- endtab -->
...
{% endtabs %}

标签容器

一个标签容器有着以下选项:

size

此选项定义标签页的大小。 其为可选项。 它可用的配置值与示例如下:

  • 第一页

  • 第二页

这是一个小(small)标签页容器的第一页。

这是一个小(small)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个没有指定大小的标签页容器的第一页。

这是一个没有指定大小的标签页容器的第二页。

  • 第一页

  • 第二页

这是一个中等大小(medium)标签页容器的第一页。

这是一个中等大小(medium)标签页容器的第一页。

  • 第一页

  • 第二页

这是一个大(large)标签页容器的第一页。

这是一个大(large)标签页容器的第二页。

align

此选项定义标签页按钮的对齐方式。 其为可选项。 它可用的配置值与示例如下:

  • 第一页

  • 第二页

这是一个没有指定对齐方式的标签页容器的第一页。

这是一个没有指定对齐方式的标签页容器的第二页。

  • 第一页

  • 第二页

这是一个居中对齐的(centered)标签页容器的第一页。

这是一个居中对齐的(centered)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个右对齐的(right)标签页容器的第一页。

这是一个右对齐的(right)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个全宽的(fullwidth)标签页容器的第一页。

这是一个全宽的(fullwidth)标签页容器的第二页。

style

此选项定义标签页按钮的样式。 其为可选项。 此外你可以将样式与全宽(fullwidth)对齐方式结合。 它可用的配置值与示例如下:

  • 第一页

  • 第二页

这是一个盒状(boxed)标签页容器的第一页。

这是一个盒状(boxed)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个拨动开关状(toggle)标签页容器的第一页。

这是一个拨动开关状(toggle)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个圆角拨动开关状(toggle-rounded)标签页容器的第一页。

这是一个圆角拨动开关状(toggle-rounded)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个全宽(fullwidth)盒状(boxed)标签页容器的第一页。

这是一个全宽(fullwidth)盒状(boxed)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个全宽(fullwidth)拨动开关状(toggle)标签页容器的第一页。

这是一个全宽(fullwidth)拨动开关状(toggle)标签页容器的第二页。

  • 第一页

  • 第二页

这是一个全宽(fullwidth)圆角拨动开关状(toggle-rounded)标签页容器的第一页。

这是一个全宽(fullwidth)圆角拨动开关状(toggle-rounded)标签页容器的第二页。

Tab

一个标签页有如下选项:

id

此选项为标签页元素的独特标识符(ID)。 此项为必填项。 一个标签页ID应当在整个页面内为独一无二的,这样Icarus才能定位、显示、和隐藏正确的标签页内容。

active

此选项标记当前的标签页是否默认显示。 此项为选填项。 同一时刻一个标签组中只有一个标签页可以标记为活动(active)标签页。

icon

此选项定义标签按钮中显示的图标。 此项为选填项。 它的值应为FontAwesome图标的class name。 如果图标的class name含有空格,则配置名与配置值需要用引号包裹住。

  • GitHub
  • Node.js

这个标签页的图标(icon)为"icon:fa-brands fa-github"

这个标签页的图标(icon)为"icon:fa-brands fa-node-js"

  • GitHub
  • Node.js

这个标签页的图标(icon)为"icon:fa-brands fa-github"

这个标签页的图标(icon)为"icon:fa-brands fa-node-js"

title

此选项定义标签按钮的标题。 其为可选项。 如果标题含有空格,则配置名与配置值需要用引号包裹住。

  • 有标题的标签页

  • 另一个有标题的标签页

这个标签页的标题(title)为("title:有标题的标签页")。

这个标签页的标题(title)为("title:另一个有标题的标签页")。