主页文章节选(自动节选和文章页description)
因为主题UI的关係,主页文章节选只支持自动节选和文章页description。
在butterfly里,有四种可供选择
- description: 只显示description
- both: 优先选择description,如果没有配置description,则显示自动节选的内容
- auto_excerpt:只显示自动节选
- false: 不显示文章内容
index_post_content: method: 3 length: 500 # if you set method to 2 or 3, the length need to config
description在front-matter里添加
页面锚点
开启页面锚点后,当你在进行滚动时,页面链接会根据标题ID进行替换
(注意: 每替换一次,会留下一个历史记录。所以如果一篇文章有很多锚点的话,网页的历史记录会很多。)
# anchor # when you scroll in post , the url will update according to header id. anchor: button: enable: false always_show: false icon: # the unicode value of Font Awesome icon, such as '\3423' auto_update: false # when you scroll in post, the URL will update according to header id.
图片描述
可开启图片Figcaption描述文字显示
优先显示图片的 title 属性,然后是 alt 属性
photofigcaption: true
复制相关配置
可配置网站是否可以复制、复制的内容是否添加版权信息
# copy settings # copyright: Add the copyright information after copied content (复制的内容后面加上版权信息) copy: enable: true copyright: enable: true limit_count: 50
添加版权信息后
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 着作权归作者所有。商业转载请联络作者获得授权,非商业转载请注明出处。
文章页相关配置
文章版权
post_copyright: enable: true decode: false author_href: license: CC BY-NC-SA 4.0 license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/
文章打赏
reward: enable: true QR_code: - img: /img/wechat.jpg link: text: 微信 - img: /img/alipay.jpg link: text: 支付宝
TOC
toc: post: true page: true number: true expand: false style_simple: false # for post scroll_percent: true
为特定的文章配置
在你的文章md文件的头部,加入toc_number和toc,并配置true或者false即可。
主题会优先判断文章Markdown的Front-matter是否有配置,如有,则以Front-matter的配置为准。否则,以主题配置文件中的配置为准
相关文章
当文章封面设置为 false 时,或者没有获取到封面配置,相关文章背景将会显示主题色。
related_post: enable: true limit: 6 # 显示推荐文章数目 date_type: created # or created or updated 文章日期显示创建日或者更新日
文章过期提醒
# 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:天数之后的文字
文章编辑按钮
# 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:
文章分页按钮
# 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
Footer 设置
博客年份
footer: owner: enable: true since: 2018
页脚自定义文本
custom_text: Hi, welcome to my <a href="https://butterfly.js.org/">blog</a>!
ICP
custom_text: <a href="icp链接"><img class="icp-icon" src="icp图片"><span>备案号:xxxxxx</span></a>
侧边栏设置 (aside)
侧边排版
aside: enable: true hide: false button: true mobile: true # display on mobile position: right # left or right display: archive: true tag: true category: true card_author: enable: true description: button: enable: true icon: fab fa-github text: Follow Me link: https://github.com/xxxxxx card_announcement: enable: true content: This is my Blog card_recent_post: enable: true limit: 5 # if set 0 will show all sort: date # date or updated sort_order: # Don't modify the setting unless you know how it works card_categories: enable: true limit: 8 # if set 0 will show all expand: none # none/true/false sort_order: # Don't modify the setting unless you know how it works card_tags: enable: true limit: 40 # if set 0 will show all color: false orderby: random # Order of tags, random/name/length order: 1 # Sort of order. 1, asc for ascending; -1, desc for descending sort_order: # Don't modify the setting unless you know how it works card_archives: enable: true type: monthly # yearly or monthly format: MMMM YYYY # eg: YYYY年MM月 order: -1 # Sort of order. 1, asc for ascending; -1, desc for descending limit: 8 # if set 0 will show all sort_order: # Don't modify the setting unless you know how it works card_webinfo: enable: true post_count: true last_push_date: true sort_order: # Don't modify the setting unless you know how it works
访问人数 busuanzi (UV 和 PV)
busuanzi: site_uv: true site_pv: true page_pv: true
如果需要修改 busuanzi 的 CDN 链接,可通过 主题配置文件 的 CDN 中的 option 进行修改
CDN: option: busuanzi: xxxxxxxxx
运行时间
runtimeshow: enable: true publish_date: 6/7/2018 00:00:00 ##网页开通时间 #格式: 月/日/年 时间 #也可以写成 年/月/日 时间
最新评论
# Aside widget - Newest Comments 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
自定义添加栏目
https://butterfly.js.org/posts/ea33ab97/
右下角按钮 (Bottom right button)
简繁转换
translate: enable: true # 默认按钮显示文字(网站是简体,应设置为'default: 繁') default: 简 #网站默认语言,1: 繁体中文, 2: 简体中文 defaultEncoding: 1 #延迟时间,若不在前, 要设定延迟翻译时间, 如100表示100ms,默认为0 translateDelay: 0 #当文字是简体时,按钮显示的文字 msgToTraditionalChinese: "繁" #当文字是繁体时,按钮显示的文字 msgToSimplifiedChinese: "简"
閲读模式
readmode: true
夜间模式
# dark mode darkmode: enable: true # dark mode和 light mode切换按钮 button: true autoChangeMode: false # Set the light mode time. The value is between 0 and 24. If not set, the default value is 6 and 18 start: # 8 end: # 22
滚动状态百分比
# show scroll percent in scroll-to-top button rightside_scroll_percent: true
按钮排序
# 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
标签外挂(Tag Plugins)
Gallery相册图库
https://butterfly.js.org/posts/4aa8abbe/#Gallery%E7%9B%B8%E5%86%8A%E5%9C%96%E5%BA%AB
原文地址:https://butterfly.js.org/