Skip to content

🔗 友情链接指南

友情链接是博客中常见的一种页面。在 SuzuBlog 中,我们采取特定的样式对友情链接进行渲染和展示,以便更好地管理和展示友链信息。

/posts/_pages/Friends.md 就是友情链接页面的文件,你可以在此文件中随意撰写任何 markdown 内容,但链接部分需要参考下面的配置方式以便正确渲染链接卡片样式。

📜 Frontmatter 配置

遵循 _pages 介绍 中的配置方式,友情链接页面也需要 Frontmatter 配置,以设置页面的基本信息和显示效果。

推荐将 showComments 设置为 true,以便访客在友链页面留言交换友链或更新信息。

🖇️ 友情链接格式

每个友链都需要遵循以下特定的 JSON 格式,确保正确生成友链卡片:

示例结构

注意我们采取代码块的形式来进行检测和渲染,要在代码块开头使用 ```Links 标记,然后在下面添加友链信息。可以参考我们自带的文件内的示例。

markdown
```Links
[
  {
  "title": "个人学术网站",
  "link": "https://www.zla.app/",
  "img": "https://r2.img.zla.app/2024/12/02/ae779a.webp",
  "des": "我的个人学术网站(英文)。"
  },
  {
  "title": "React 工具库",
  "link": "https://react.zla.app/",
  "img": "https://react.zla.app/logo.png",
  "des": "我自己搭建和维护的 React 工具库。"
  }
]
```

配置说明

友链的 JSON 结构如下:

json
{
  "title": "链接的名称",
  "link": "链接的地址",
  "img": "链接的图标或头像",
  "des": "链接的描述"
}
  • title:链接的标题,例如个人博客或项目名称。
  • link:链接的完整 URL。
  • img:链接的头像 URL,支持任意大小、格式的图片。
  • des:链接的简短描述,用于说明站点或项目的特点,鼠标悬浮时显示(若为空则不显示)。

按照以上格式配置后,你的友情链接页面将正确生成,方便管理与展示。✨

此文档基于 CC BY 4.0 进行授权