安知鱼主题侧边栏最近发布的修改

老刘博客2026-02-182026-02-19

安知鱼主题是一款非常不错的 Hexo 博客主题，对于新手来说还是非常有好的，丰富的文档教程，互联网的魔改教程也很多，如果你没有强迫症，基本上不需要做任何改动，就可以很顺利的构建好博客，今天我们来做一个简单的修改，就是给安知鱼主题调用的 最近发布 栏目的文章添加时间标签。

1.调用文章发布时间

如上面的封面，安知鱼主题无论是在首页、列表页、内容页，还是其他页面，调用出来的 最近发布 列表，只有文章的缩略图和标题，我们的修改，就是想给调用的文章添加一个时间。

其实，安知鱼主题调用的 最近发布 列表的文章，包含一个时间，只是时间的 CSS 样式没有写好，浏览器不能够正常渲染而已，我们只需要给这个标签添加好对应的 CSS 样式就可以，我们需要进入如下的文件夹中

1	/themes/anzhiyu/source/css\_layout/

找到 sidebar.styl 样式文件，打开之后，搜索 time 关键词，会找到如下样式代码

/* 最近文章样式修改 */
#aside-content .aside-list > .aside-list-item .content > time {
  display: none;
}
#aside-content .aside-list > .aside-list-item .content > .title {
  -webkit-line-clamp: 3;
  font-weight: 700;
  padding: 2px 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
}

将其修改为

/* 最近文章样式修改 */
#aside-content .aside-list > .aside-list-item .content > time {
  display: block;
  color: var(--card-meta);
  font-size: .85e;
}
#aside-content .aside-list > .aside-list-item .content > .title {
  color: var(--font-color);
  font-size: 95%;
  line-height: 1.5;
  -webkit-line-clamp: 2
}

这两行代码，来自伟大的 Butterfly 主题文件，感兴趣的朋友可以自己查阅。

2.首页调用最近发布

在一些 Butterfly 主题博客中，是可以很轻松就在首页调用出 最近发布 的栏目的，甚至有些网站都可以调用 随机文章 来做推荐，这无疑使得 Hexo 博客的主题内容更加的丰富，我们今天就来修改安知鱼主题的文件，实现在博客首页调用 最近发布 的功能。大家进入

1	/themes/anzhiyu/layout/includes/widget

文件夹，找到 index.pug 文件，在里面找到

1	!=partial('includes/widget/card_recent_post', {}, {cache: true})

这段代码，就是调用 最近发布 栏目的代码，将这段代码复制粘贴到

else
  //- page
  !=partial('includes/widget/card_author', {}, {cache: true})
  !=partial('includes/widget/card_announcement', {}, {cache: true})
  !=partial('includes/widget/card_weixin', {}, {cache: true})
  !=partial('includes/widget/card_top_self', {}, {cache: true})
  !=partial('includes/widget/card_categories', {}, {cache: true})

最后的效果是

else
  //- page
  !=partial('includes/widget/card_author', {}, {cache: true})
  !=partial('includes/widget/card_weixin', {}, {cache: true})
  !=partial('includes/widget/card_announcement', {}, {cache: true})
  !=partial('includes/widget/card_recent_post', {}, {cache: true})
  !=partial('includes/widget/card_top_self', {}, {cache: true})
  !=partial('includes/widget/card_categories', {}, {cache: true})