【笔记】给博客加个“更新日志”

觉得搞一个一个更新日志记录一下博客发疯日常还挺有意义的（？）图片描述

于是在看不懂任何代码的情况下，结合DeepSeek自己试了一下，居然...成功了？？？成功图标

那就在这记录一下吧

效果图

xiaoguo.png

实现方式（以anzhiyu为例）

新建 themes/anzhiyu/layout/includes/page/update.pug

添加以下内容

plaintext
1
2
3
4
5
6
7
8
9
10
11
12
13
14
#album
  .author-content.author-content-item.album.single(style='background: url(这里是顶部图片的链接) center / cover no-repeat;')
    .card-content
      .author-content-item-tips 更新日志
      span.author-content-item-title 这里是本站更新日志
      .content-bottom
        .tips 应该不会刷版本号（？）
        .banner-button-group
          a.banner-button(onclick='pjax.loadUrl("/about/")')
            i.anzhiyufont.anzhiyu-icon-arrow-circle-right(style='font-size: 1.5rem')
            span.banner-button-text 关于本人

#article-container
  != page.content

修改 themes/anzhiyu/layout/page.pug

直接添加以下内容
2.png

plaintext
1
2
3
4
when 'update'
  include includes/page/update.pug
default
  include includes/page/default-page.pug

新建一个页面

终端执行 hexo new page update
添加以下内容

plaintext
1
2
3
4
5
6
7
---
title: 更新日志
date: 2025-02-21 21:09:00
comments: false
aside: false
type: update
---
提示： 这里的type: update 需要和前面的文件对应

在新建的页面里填写内容

plaintext
1
2
3
4
5
6
7
8
9
10
11
12
{% timeline 2025,blue %}

<!-- timeline 02-18 -->
更新日志功能上线
<!-- endtimeline -->

<!-- timeline 02-18 -->
114514
<!-- endtimeline -->

{% endtimeline %}

然后访问域名/update 即可看到效果