Welcome to Hexo ! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub .
Quick Start Create a new post 1 $ hexo new "My New Post"
More info: Writing
Run server
More info: Server
Generate static files
More info: Generating
Deploy to remote sites
More info: Deployment
文章 1 2 3 4 5 6 7 8 9 10 11 12 13 title: myfirst date : 2022-07-19 11:08:06tags: 标签 cover: 文章封面 description: 描述 sticky: 文章置顶数字越大,置顶优先级越大 copyright: false 转载文章不需要设置版权 设置版权: copyright_author: xxxx copyright_author_href: https://xxxxxx.com copyright_url: https://xxxxxx.com copyright_info: 此文章版權歸xxxxx所有,如有轉載,請註明來自原作者
文章打赏 1 2 3 4 5 6 7 8 9 reward: enable : true QR_code: - img: /img/wechat.jpg link : text: 微信 - img: /img/alipay.jpg link : text: 支付寶
相册图库 1 2 3 4 5 <div class="gallery-group-main" > {% galleryGroup name description link img-url %} {% galleryGroup name description link img-url %} {% galleryGroup name description link img-url %} </div>
name:圖庫名字
description:圖庫描述
link:連接到對應相冊的地址
img-url:圖庫封面的地址
相册 1 2 3 4 5 6 7 8 9 10 {% gallery %} ![](https://i.loli.net/2019/12/25/Fze9jchtnyJXMHN.jpg) ![](https://i.loli.net/2019/12/25/ryLVePaqkYm4TEK.jpg) ![](https://i.loli.net/2019/12/25/gEy5Zc1Ai6VuO4N.jpg) ![](https://i.loli.net/2019/12/25/d6QHbytlSYO4FBG.jpg) ![](https://i.loli.net/2019/12/25/6nepIJ1xTgufatZ.jpg) ![](https://i.loli.net/2019/12/25/E7Jvr4eIPwUNmzq.jpg) ![](https://i.loli.net/2019/12/25/mh19anwBSWIkGlH.jpg) ![](https://i.loli.net/2019/12/25/2tu9JC8ewpBFagv.jpg) {% endgallery %}
tag-hide 1 {% hideInline content,display,bg ,color %}
content: 文本內容
display: 按鈕顯示的文字(可選)
bg: 按鈕的背景顏色(可選)
color: 按鈕文字的顏色(可選)
mermaid 1 2 3 {% mermaid %} 內容 {% endmermaid %}
1 2 3 4 5 6 7 8 {% mermaid %} pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5 {% endmermaid %}
Tabs 1 2 3 4 5 6 7 8 9 10 11 12 13 {% tabs test1 %} <!-- tab --> **This is Tab 1.** <!-- endtab --> <!-- tab --> **This is Tab 2.** <!-- endtab --> <!-- tab --> **This is Tab 3.** <!-- endtab --> {% endtabs %}
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 自定义Tab名 + 只有icon + icon和Tab名 {% tabs test4 %} <!-- tab 第一個Tab --> **tab名字為第一個Tab** <!-- endtab --> <!-- tab @fab fa-apple-pay --> **只有圖標 沒有Tab名字** <!-- endtab --> <!-- tab 炸彈@fas fa-bomb --> **名字+icon** <!-- endtab --> {% endtabs %}
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 {% btn [url],[text],[icon],[color] [style] [layout] [position] [size] %} [url] : 鏈接 [text] : 按鈕文字 [icon] : [可選] 圖標 [color] : [可選] 按鈕背景顔色(默認style時) 按鈕字體和邊框顔色(outline時) default/blue/pink/red/purple/orange/green [style] : [可選] 按鈕樣式 默認實心 outline/留空 [layout] : [可選] 按鈕佈局 默認為line block/留空 [position] : [可選] 按鈕位置 前提是設置了layout為block 默認為左邊 center/right/留空 [size] : [可選] 按鈕大小 larger/留空
1 2 3 4 5 6 7 8 9 <div class ="btn-center" > {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline blue larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline pink larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline red larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline purple larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline orange larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline green larger %} </div >
inlineImg 主題中的圖片都是默認以塊級元素
顯示,如果你想以內聯元素
顯示,可以使用這個標簽外掛。
1 2 3 4 {% inlineImg [src] [height] %} [src] : 圖片鏈接 [height] : 圖片高度限制【可選】
label
timeline 1 2 3 4 5 6 7 8 {% timeline title,color %} <!-- timeline title --> xxxxx <!-- endtimeline --> <!-- timeline title --> xxxxx <!-- endtimeline --> {% endtimeline %}
1 2 3 4 5 {% timeline 2022 %} <!-- timeline 01-02 --> 這是測試頁面 <!-- endtimeline --> {% endtimeline %}
這是測試頁面
flink 1 2 3 {% flink %} xxxxxx {% endflink %}
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 {% flink %} - class_name: 友情鏈接 class_desc: 那些人,那些事 link_list: - name: JerryC link : https://jerryc.me/ avatar: https://jerryc.me/img/avatar.png descr: 今日事,今日畢 - name: Hexo link : https://hexo.io/zh-tw/ avatar: https://d33wubrfki0l68.cloudfront.net/6657ba50e702d84afb32fe846bed54fba1a77add/827ae/logo.svg descr: 快速、簡單且強大的網誌框架 - class_name: 網站 class_desc: 值得推薦的網站 link_list: - name: Youtube link : https://www.youtube.com/ avatar: https://i.loli.net/2020/05/14/9ZkGg8v3azHJfM1.png descr: 視頻網站 - name: Weibo link : https://www.weibo.com/ avatar: https://i.loli.net/2020/05/14/TLJBum386vcnI1P.png descr: 中國最大社交分享平台 - name: Twitter link : https://twitter.com/ avatar: https://i.loli.net/2020/05/14/5VyHPQqR6LWF39a.png descr: 社交分享平台 {% endflink %}
添加分类和标签
分别创建categories和tags
1 2 hexo new page categories hexo new page tags
分别编辑页面categories和tags
1 2 3 4 5 --- title: 分类 data: 2020-7-20 2:34:08 type : 'categories' ---
1 2 3 4 5 --- title: 标签 data: 2020-7-20 2:34:08 type : 'tags' ---
实际使用
1 2 3 4 categories: - hexo tags: - linux
配置别名(可以不配)
在配置中更新别名,其中:
以前的是正式的名称,以后的是访问的路径
1 2 3 4 5 6 7 category_map: hexo:hexo ubuntu:ubuntu tag_map: linux:linux vim:vim hexo:hexo
部署生效
1 2 3 hexo clean hexo g hexo d
在导航栏添加点东西
例如我添加了一个更新日志的模块。
在主题的配置文件中,menu添加一栏:Board: /board
。
然后在source中添加一个board,即对应上面的名字。然后再创建一个index.md,里面可以写你想写的内容。
在主题的hueman/langulages/zh-CN.yml
中的index适当的位置加:board: '更新日志'
,位置和名字是你自己设定。
重新部署,然后就OK了
在侧边栏添加点东西
回到你的主题的配置文件中,找到widgets
一栏,在你要添加的位置处添加一条你自定义的名称。例如我的叫communiation
且放在了第二行。
在上面所提到的zh-CN.yml
文件中找到sidebar一栏,添加communiation: '你要设的名称'
。
在hueman/layout/widget
中添加一个communiation.ejs
,填入模板
1 2 3 4 5 6 7 8 <% if (site.posts.length) { %> <div class="widget-wrap widget-list" > <h3 class="widget-title" ><%= __('sidebar.communiation' ) %></h3> <div class="widget" > <!--这里添加你要写的内容--> </div> </div> <% } %>