博客更新成 Butterfly Theme 的过程中遇到的问题

2022-03-17 21:34:31 浏览数 (1)

这篇文章只是记录我在更新中遇到的问题,没有太多的价值了。

Post Front-matter

代码语言:javascript复制
---
title:
date:
updated:
tags:
categories:
keywords:
description:
top_img:
comments:
cover:
toc:
toc_number:
copyright:
copyright_author:
copyright_author_href:
copyright_url:
copyright_info:
mathjax:
katex:
aplayer:
highlight_shrink:
aside:
---

寫法

解釋

title

【必需】文章標題

date

【必需】文章創建日期

updated

【可選】文章更新日期

tags

【可選】文章標籤

categories

【可選】文章分類

keywords

【可選】文章關鍵字

description

【可選】文章描述

top_img

【可選】文章頂部圖片

cover

【可選】文章縮略圖(如果沒有設置top_img,文章頁頂部將顯示縮略圖,可設為false/圖片地址/留空)

comments

【可選】顯示文章評論模塊(默認 true)

toc

【可選】顯示文章TOC(默認為設置中toc的enable配置)

toc_number

【可選】顯示toc_number(默認為設置中toc的number配置)

copyright

【可選】顯示文章版權模塊(默認為設置中post_copyright的enable配置)

copyright_author

【可選】文章版權模塊的文章作者

copyright_author_href

【可選】文章版權模塊的文章作者鏈接

copyright_url

【可選】文章版權模塊的文章連結鏈接

copyright_info

【可選】文章版權模塊的版權聲明文字

mathjax

【可選】顯示mathjax(當設置mathjax的per_page: false時,才需要配置,默認 false)

katex

【可選】顯示katex(當設置katex的per_page: false時,才需要配置,默認 false)

aplayer

【可選】在需要的頁面加載aplayer的js和css,請參考文章下面的音樂 配置

highlight_shrink

【可選】配置代碼框是否展開(true/false)(默認為設置中highlight_shrink的配置)

aside

【可選】顯示側邊欄 (默認 true)

如何添加友情链接?

首先是在目录source/_date下有一个叫做link.yml的文件,这个是用来配置添加哪些友情链接的。

about没有一个很好的显示,该这么办呢?

about 可以放自己的 cv 所以并不去规范格式。

有意思了,这个网站可以找到好多的图标

网站链接: https://fontawesome.com/

如何将文章置顶呢?

front-matter中添加sticky: 1属性,数值越大,优先级越高

如何添加cover呢?

front-matter中添加cover: [a]属性,a 可以是 left/right/both/false。false就是没有cover的模式。

如何控制版权呢?

一般会包含版权的,在不需要包含的文章可以添加copyright: false的属性。

如果是收录的文章,要单独设置:

代码语言:javascript复制
copyright_author: xxxx
copyright_author_href: https://xxxxxx.com
copyright_url: https://xxxxxx.com
copyright_info: 此文章版权归xxxxx所有,如有转载,请註明来自原作者

在footer添加备案号

主题配置文件中的footer添加下面这个属性

代码语言:javascript复制
footer
  custom_text: <a href="icp链接"><img class="icp-icon" src="icp图片"><span>备案号:xxxxxx</span></a>

国内使用的icon仓库是哪一个呢?

答案是:iconfont

神奇的tabs

之后可以尝试以一下,代码如下:

代码语言:javascript复制
{% tabs test1 %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->

<!-- tab -->
**This is Tab 2.**
<!-- endtab -->

<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}

效果:

还有很多新奇的操作,就不一一列举了

记录:使用lancecloud作为云存储

可以给搜索引擎提交自己的网站,使他可以被搜索到。

代码语言:javascript复制
# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification:

# Bing Webmaster tools verification setting
# See: https://www.bing.com/webmaster/
bing_site_verification:

# Baidu Webmaster tools verification setting
# See: https://ziyuan.baidu.com/site/
baidu_site_verification:

# 360 Webmaster tools verification setting
# see http://zhanzhang.so.com/
qihu_site_verification:

# Yandex Webmaster tools verification setting
# see https://webmaster.yandex.com/
yandex_site_verification:

math

我们使用katex来渲染latex math formula

1 1^2

注意:我们需要在用到了latex formula的文档中添加katex: true的属性

可不可以同时deploy到很多地方呢?

PWA渐进式增强web应用

notice that pjax would not support some page need to exclude these pages

gitalk 配置问题

太搞笑了,我的gitalk又出了https和http写错了的问题,这个会直接导致我的app报错

改成中文的tags和英文的categories 以及修改cover: false

Library ToolBook Collection

NoteBook GeneralNote ReadingNote

DailyLife Normal Special

Project Collaboration Solo

leansCloud 踩坑

这个并不是必须的,在未来在博客中添加说说的时候可以使用这个。暂时不管。(可以是双评论系统)

valine 静态评论系统魔改

这个链接有一些很有意思的标签配置:https://blog.csdn.net/weixin_43868299/article/details/108894568

0 人点赞