post_meta: page: date_type:both# created or updated or both 主頁文章日期是創建日或者更新日或都顯示 date_format:relative# date/relative 顯示日期還是相對日期 categories:true# true or false 主頁是否顯示分類 tags:true# true or false 主頁是否顯示標籤 label:true# true or false 顯示描述性文字 post: date_type:both# created or updated or both 文章頁日期是創建日或者更新日或都顯示 date_format:relative# date/relative 顯示日期還是相對日期 categories:true# true or false 文章頁是否顯示分類 tags:true# true or false 文章頁是否顯示標籤 label:true# true or false 顯示描述性文字
# anchor # when you scroll in post , the url will update according to header id. anchor:true
文章過期提醒
可設置是否顯示文章過期提醒，以更新時間為基準。
1 2 3 4 5 6 7 8
# Displays outdated notice for a post (文章過期提醒) noticeOutdate: enable: true style: flat # style: simple/flat limit_day: 365 # When will it be shown position: top # position: top/bottom message_prev: It has been message_next: days since the last update, the content of the article may be outdated.
limit_day： 距離更新時間多少天才顯示文章過期提醒
message_prev ： 天數之前的文字
message_next：天數之後的文字
style: flat
style: simple
文章編輯按鈕
在文章標題旁邊顯示一個編輯按鈕，點擊會跳轉到對應的鏈接去。
1 2 3 4 5 6 7
# Post edit # Easily browse and edit blog source code online. post_edit: enable:false # url: https://github.com/user-name/repo-name/edit/branch-name/subdirectory-name/ # For example: https://github.com/jerryc127/butterfly.js.org/edit/main/source/ url:
文章分頁按鈕
可設置分頁的邏輯，也可以關閉分頁顯示
1 2 3 4 5 6
# post_pagination (分頁) # value: 1 || 2 || false # 1: The 'next post' will link to old post # 2: The 'next post' will link to new post # false: disable pagination post_pagination:false
參數
解釋
post_pagination: false
關閉分頁按鈕
post_pagination: 1
下一篇顯示的是舊文章
post_pagination: 2
下一篇顯示的是新文章
頭像
修改 主題配置文件
1 2 3
avatar: img:/img/avatar.png effect:true# 頭像會一直轉圈
圖片描述
可開啟圖片Figcaption描述文字顯示
優先顯示圖片的 title 屬性，然後是 alt 屬性
修改 主題配置文件
1
photofigcaption:true
複製相關配置
可配置網站是否可以複製、複製的內容是否添加版權信息
1 2 3 4 5 6 7
# copy settings # copyright: Add the copyright information after copied content (複製的內容後面加上版權信息) copy: enable: true copyright: enable: true limit_count: 50
配置
解釋
enable
是否開啟網站複製權限
copyright
複製的內容後面加上版權信息
enable
是否開啟複製版權信息添加
limit_count
字數限制，當複製文字大於這個字數限制時，將在複製的內容後面加上版權信息
添加版權信息後
1 2 3 4 5 6 7
Lorem ipsum dolor sit amet, test link consectetur adipiscing elit. Strong text pellentesque ligula commodo viverra vehicula. Italic text at ullamcorper enim. Morbi a euismod nibh. Underline text non elit nisl. Deleted text tristique, sem id condimentum tempus, metus lectus venenatis mauris, sit amet semper lorem felis a eros. Fusce egestas nibh at sagittis auctor. Sed ultricies ac arcu quis molestie. Donec dapibus nunc in nibh egestas, vitae volutpat sem iaculis. Curabitur sem tellus, elementum nec quam id, fermentum laoreet mi. Ut mollis ullamcorper turpis, vitae facilisis velit ultricies sit amet. Etiam laoreet dui odio, id tempus justo tincidunt id. Phasellus scelerisque nunc sed nunc ultricies accumsan.
作者: Jerry 連結: http://localhost:4000/posts/bd3c650b/#Paragraph 來源: Butterfly 著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。
# dark mode darkmode: enable:true # dark mode和 light mode切換按鈕 button:true autoChangeMode:false
V2.0.0 開始增加一個選項，可開啟自動切換light mode 和 dark mode
autoChangeMode: 1 跟隨系統而變化，不支持的瀏覽器/系統將按照時間晚上6點到早上6點之間切換為 dark mode
autoChangeMode: 2 只按照時間 晚上6點到早上6點之間切換為 dark mode,其餘時間為light mode
autoChangeMode: false 取消自動切換
閲讀模式
閲讀模式下會去掉除文章外的內容，避免幹擾閲讀。
只會出現在文章頁面，右下角會有閲讀模式按鈕。
修改 主題配置文件
1
readmode:true
按鈕排序
1 2 3 4 5 6 7
# Don't modify the following settings unless you know how they work (非必要請不要修改 ) # Choose: readmode,translate,darkmode,hideAside,toc,chat,comment # Don't repeat 不要重複 rightside_item_order: enable:false hide:# readmode,translate,darkmode,hideAside show:# toc,chat,comment
aside: enable:true hide:false button:true mobile:true# 手機頁面（ 顯示寬度 < 768px ）是否顯示aside內容 position:right# left or right card_author: enable:true description: button: enable:true icon:fabfa-github text:Github link:https://github.com/jerryc127/hexo-theme-butterfly card_announcement: enable:true content:ThisismyBlog card_recent_post: enable:true limit:5# if set 0 will show all sort:date# date or updated card_categories: enable:true limit:8# if set 0 will show all expand:none# none/true/false card_tags: enable:true limit:40# if set 0 will show all color:false card_archives: enable:true type:monthly# yearly or monthly format:MMMMYYYY# eg: YYYY年MM月 order:-1# Sort of order. 1, asc for ascending; -1, desc for descending limit:8# if set 0 will show all card_webinfo: enable:true post_count:true last_push_date:true
由於 API 有 訪問次數限制，為了避免調用太多，主題默認存取期限為 10 分鐘。也就是説，調用後資料會存在 localStorage 裏，10分鐘內刷新網站只會去 localStorage 讀取資料。 10 分鐘期限一過，刷新頁面時才會去調取 API 讀取新的數據。（ 3.6.0 新增了 storage 配置，可自行配置緩存時間）
在側邊欄顯示最新評論板塊
修改 主題配置文件
1 2 3 4 5 6 7
# Aside widget - NewestComments newest_comments: enable: true sort_order: # Don't modify the setting unless you know how it works limit: 6 storage: 10 # unit: mins, save data to localStorage avatar: true
note: # Note tag style values: # - simple bs-callout old alert style. Default. # - modern bs-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:simple icons:false border_radius:3 # 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
<div class="gallery-group-main"> {% galleryGroup name description link img-url %} {% galleryGroup name description link img-url %} {% galleryGroup name description link img-url %} </div>
Unique name : Unique name of tabs block tag without comma. Will be used in #id's as prefix for each tab with their index numbers. If there are whitespaces in name, for generate #id all whitespaces will replaced by dashes. Only for current url of post/page must be unique! [index] : Index number of active tab. If not specified, first tab (1) will be selected. If index is -1, no tab will be selected. It's will be something like spoiler. Optional parameter. [Tab caption] : Caption of current tab. If not caption specified, unique name with tab index suffix will be used as caption of tab. If not caption specified, but specified icon, caption will empty. Optional parameter. [@icon] : FontAwesome icon name (full-name, look like 'fas fa-font') Can be specified with or without space; e.g. 'Tab caption @icon' similar to 'Tab caption@icon'. Optional parameter.
This is my website, click the button {% btn 'https://butterfly.js.org/',Butterfly %} This is my website, click the button {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right %} This is my website, click the button {% btn 'https://butterfly.js.org/',Butterfly,,outline %} This is my website, click the button {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,outline %} This is my website, click the button {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,larger %}
This is my website, click the button Butterfly This is my website, click the button Butterfly This is my website, click the button Butterfly This is my website, click the button Butterfly This is my website, click the button Butterfly
1 2 3
{% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,block %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,block center larger %} {% btn 'https://butterfly.js.org/',Butterfly,far fa-hand-point-right,block right outline larger %}
