hexo使用

流程

在git bash中跳转到hexo的博客文件夹，输入

1 2	$ hexo new test INFO Created: ~\desktop\hexo\blog\source\_posts\test.md

找到该文章，打开，使用Markdown语法

注意每次generate之前最好清除掉之前的缓存。

1	$ hexo clean

编辑完成后，执行以下命令（简写hexo g / hexo s）

1	$ hexo generate

1
2
3

$ hexo server
INFO  Start processing
INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

打开http://localhost:4000/，文章已经成功发布。

然后发布到github上，执行以下命令（简写hexo d）

1	$ hexo deploy

草稿

1	$ hexo new (post)

其实是省略了post的写法，会新生成一个post页面。

如果暂时不想发布，只想作为草稿编辑的话，应使用

1	$ hexo new draft XXX

通过以下命令查看带草稿页面的hexo预览。

1	$ hexo server --draft

通过以下命令将草稿页面publish到正式的post文件中，并自动添加发布时间。

1	$ hexo pubulish XXX newXXX

butterfly使用

~~butterfly v3.0.0 地址迁移至Butterfly - A Simple and Card UI Design theme for Hexo~~

butterfly地址迁移至Butterfly - A Simple and Card UI Design theme for Hexo。

以下内容均转自Butterfly - A Simple and Card UI Design theme for Hexo，小弋の生活馆全样式预览 | 小弋の生活馆以及 Hexo博客之butterfly主题优雅魔改系列（持续更新） | 小康博客，相关内容可自行去各位大佬博客查询。

渐变色

直接生成即可。彩色渐变字HTML代码生成器

渐变色文字

标签外挂(note)

主题自带note

主题自带的标签。

default 提示塊標籤

primary 提示塊標籤

success 提示塊標籤

info 提示塊標籤

warning 提示塊標籤

danger 提示塊標籤

另一种note

实现起来也很简单，只是对简单的 p 标签进行修改，为了方便添加颜色，这里提供了以上五种配色的样式。

使用起来也会简单，为了兼容各种平台，不推荐 tag 标签的写法。因此只又 html 标签的写法。这样做的好处是即便复制到各大平台也不会出现奇奇怪怪的标签符号或者报错。

note 效果展示：

绿色

红色

黄色

灰色

蓝色

小 tag 标签效果展示：

红色小标签
绿色小标签
蓝色小标签
黄色小标签
灰色小标签

渐变note（上标式外挂标签）

因为标签外挂的语法会导致复制到其他平台不便利，因此建议使用 HTML 写法。

默认情况

success

error

warning

为简单的一句话提供的简便写法。

动画标签

各种标签也可以用html的方式配合上动画，变成动画标签，效果还是比较夸张的！！！

默认情况

success

error

warning

volantis 主题的 note

因为标签外挂的语法会导致复制到其他平台不便利，因此只提供 HTML 写法。

默认 red

info

done

success

danger

error

radiation

bug

idea-yellow

link- blue

paperclip

todo

msg cyan

guide

download

undo

小标题

Windows 10不是为所有人设计,而是为每个人设计

嵌套测试

请坐和放宽，我正在帮你搞定一切…

隐藏按钮(tag-hide )

主题自带的隐藏按钮。

inline

哪個英文字母最酷？因為西裝褲(C裝酷)

門裏站着一個人? 閃

block

傻子，怎麼可能有答案

toggle

Butterfly安裝方法

在你的博客根目錄裏

git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

如果想要安裝比較新的dev分支，可以

git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

复选框

纯文本测试

支持简单的 markdown 语法

支持自定义颜色

绿色 + 默认选中

黄色 + 默认选中

青色 + 默认选中

蓝色 + 默认选中

增加

减少

叉

纯文本测试

支持简单的 markdown 语法

支持自定义颜色

绿色

黄色

青色

蓝色

按钮

文内按钮

This is my website, click the button JerryC
This is my website, click the button JerryC
This is my website, click the button JerryC
This is my website, click the button JerryC
This is my website, click the button JerryC

inlineImg

你看我長得漂亮不

我覺得很漂亮

label

臣亮言：先帝創業未半，而中道崩殂。今天下三分，益州疲敝，此誠危急存亡之秋也！然侍衞之臣，不懈於內；忠志之士，忘身於外者，蓋追先帝之殊遇，欲報之於陛下也。誠宜開張聖聽，以光先帝遺德，恢弘志士之氣；不宜妄自菲薄，引喻失義，以塞忠諫之路也。
宮中、府中，俱為一體；陟罰臧否，不宜異同。若有作奸、犯科，及為忠善者，宜付有司，論其刑賞，以昭陛下平明之治；不宜偏私，使內外異法也。

动画图标

起源于看到Sakura主题的Font Awesome动态图标很好看，例如主页图标，研究了一下，原来是一个开源的css代码，只要引入即可！

自动动画

hover动画

Mermaid

画流程图、甘特图、饼状图等，代码绘图。 Mermaid

Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.

流程图

各类形状框

graph LR
 A(A)
 B[B]
 C{C}
 D((D))
 E>E]
 F{{F}}
 G[/G/]
 H[\H\] 
 I[/I\]
 J[\J/]

graph TB A(A) B[B] C{C} D((D)) E>E] F G[/G/] H[\H\] I[/I\] J[\J/]

流程图

graph TB
 A[把大象放进去] --> B{"冰箱大小？"}
 B -- 大 --> C[关冰箱门]
 B -->|小| D[换大冰箱]
 E -. 虚线 .-  F
 G -. 虚线箭头 .-> H
 style E fill:#f9f,stroke:#333,stroke-width:4px
 style G fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5

graph TB A[把大象放进去] --> B{"冰箱大小？"} B -- 大 --> C[关冰箱门] B -->|小| D[换大冰箱] E -. 虚线 .- F G -. 虚线箭头 .-> H style E fill:#f9f,stroke:#333,stroke-width:4px style G fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5

graph LR
 A[Hard edge] -->|Link text| B(Round edge)
 B --> C{Decision}
 C -->|One| D[Result one]
 C -->|Two| E[Result two]

graph LR A[Hard edge] -->|Link text| B(Round edge) B --> C{Decision} C -->|One| D[Result one] C -->|Two| E[Result two]

饼图

pie
    title Key elements in Product X
    "Calcium" : 42.96
    "Potassium" : 50.05
    "Magnesium" : 10.01
    "Iron" :  5

pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5

hexo使用

流程

草稿

butterfly使用

渐变色

标签外挂(note)

主题自带note

另一种note

渐变note（上标式外挂标签）

动画标签

volantis 主题的 note

隐藏按钮(tag-hide )

inline

block

toggle

标签

复选框

按钮

文内按钮

独占一行的按钮

一行多个实心按钮

一行多个空心按钮

inlineImg

label

动画图标

Mermaid

流程图

各类形状框

流程图

饼图