如何在安知鱼主题中加入无聊湾

进行主题修改前必看

• 博客魔改有风险，请务必备份你的原代码

• 因为.pug和.styl以及.yml等对缩进要求较为严格，请尽量不要使用记事本等无法提供语法高亮的文本编辑器进行修改。

• 本文涉及修改内容会以diff代码块进行标识,复制时请不要忘记删除前面的+,-符号

• 本帖基于Anzhiyu主题进行修改方案编写，因此请读者优先掌握Anzhiyu主题官方文档的内容后再来进行魔改。

前言

轮到我来水一篇大文章,窃喜

有一天无聊了起来,看见大家的博客里面添加有一些有趣的元素,其中就以无聊湾最为醒目,有的放置在侧边栏,也有的放置在博客页脚

看起来是个十分无趣(有趣)的项目,而我的安知鱼主题中基本所有的元素塞满了,所以我想了想放在博客底部是否可行,不过本人没什么代码基础,只能借助源代码怎么写的,就跟着怎么仿照元素搓一个开关出来,代码写的不好看,见谅.

修改

1. 首先,得加入无聊湾获取统计API(在我看来也是一个统计作用),

2. 找到themes>anzhiyu>layout>includes>footer.pug

      .footer-bar-right
        each item in theme.footer.footerBar.linkList
          a.footer-bar-link(href=url_for(item.link) title=item.text)=item.text
        if theme.footer.footerBar.cc.enable
          a.footer-bar-link.cc(href=url_for(theme.footer.footerBar.cc.link) title="cc协议")
            i.anzhiyufont.anzhiyu-icon-copyright-line
            i.anzhiyufont.anzhiyu-icon-creative-commons-by-line
            i.anzhiyufont.anzhiyu-icon-creative-commons-nc-line
            i.anzhiyufont.anzhiyu-icon-creative-commons-nd-line
+          //- 在这里插入 BoringBay Badge
+        if theme.footer.footerBar.badge.enable  
+          a.footer-bar-link.badge(
+            href=theme.footer.footerBar.badge.link
+            title=theme.footer.footerBar.badge.title
+            target="_blank"
+            style="margin-left:8px"
+          )
+            img(
+              src=`https://boringbay.com/api/badge/${theme.footer.footerBar.badge.domain}`
+              height=theme.footer.footerBar.badge.height
+              alt=theme.footer.footerBar.badge.title
+            )

3. 随后找到_config.anzhiyu.yml进行添加代码缺失的元素

  footerBar:
    enable: true
    authorLink: /about
    cc:
      enable: true
      link: /copyright
+    badge:
+      enable: true
+      link: https://boringbay.com # 点击跳转链接
+      domain: "blog.gbfun.cc" # 无聊湾API与图标src 末尾域名 可以在这里了解https://boringbay.com/join-us
+      title: "无聊湾 🥱 The Boring Bay" # 图显标题
+      height: "18px" # 无聊湾徽标高度

最后执行三连享受无聊吧

🥱