博客改造记录2

增加友链

1
2
3
# Menu 目錄
menu:
  友链: /link/ || fas fa-link

路径：blog\source\data\link.yml

1
2
3
4
5
6
7
8
- class_name: 友链分类名
  class_desc: 友链分类解释
  link_list:
    - name: SamsaraMBJC'Blog 博客改造
      link: https://samsarambjc.github.io/posts/bdff8410.html
      avatar: https://github.com/SamsaraMBJC/SamsaraMBJC.github.io/blob/main/img/link/MBJC.gif?raw=true #或者png
      descr: 相逢只是偶然吗？
      siteshot: https://github.com/SamsaraMBJC/SamsaraMBJC.github.io/blob/main/img/link/MBJC_shot.png?raw=true

路径：blog\themes\butterfly\source\css_page\flink.styl 第124行

1
2
3
4
5
6
7
8
9
10
11
12
13
& > a
  width: calc(100% / 3 - 0.5rem); /* 改成每行三个 */
  height 150px                    /* 可修改高度 */
  position relative
  display block
  margin: 0.5rem 0.25rem;     /* 第二个值为横向间距 */
  float left
  overflow hidden
  padding: 0;
  border-radius: 8px;
  transition all .3s ease 0s, transform .6s cubic-bezier(.6, .2, .1, 1) 0s
  box-shadow none
  border: var(--style-border)!important;

调整可以解决flexcard模式下格式不正确的问题

修改github follow 链接

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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/SamsaraMBJC

增加打赏投币效果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

reward:
  enable: true
  coinAudio: https://cdn.cbd.int/akilar-candyassets@1.0.36/audio/aowu.m4a
  QR_code:
    - img: /img/QR/wechat.jpg
      link:
      text: wechat
    - img: /img/QR/alipay.jpg
      link:
      text: alipay

CDN:
    # main
    main_css: /css/index.css
    jquery: https://cdn.cbd.int/jquery@latest/dist/jquery.min.js
    main: /js/main.js
    utils: /js/utils.js

    option:
    # 打赏按钮投币效果
    coin_js: /js/coin/coin.js
    coin_css: /css/coin/coin.css

参考链接