友链

移除友链页面#

友链页面是用于显示您朋友博客链接的页面，默认启用。

如果您出于任何原因想要移除友链页面，请按照本节中的步骤操作。否则，您可以跳过本节继续阅读下一章。

在 src/site.config.ts 中将 links.enable 设置为 false：

export const integ: IntegrationUserConfig = {
  // ...
  links: {
    enable: false
  }
}

此外，请记得删除以下文件夹和文件：

• src/components/links/
• src/pages/links/
• public/links.json

基本配置#

友链的基本配置位于 src/site.config.ts 中。您可以添加朋友的日志或自己的链接信息。

export const integ: IntegrationUserConfig = {
  links: {
    // 朋友日志
    logbook: [
      { date: '2025-03-16', content: '有泄漏吗？' },
      { date: '2025-03-16', content: '什么泄漏？' },
      { date: '2025-03-16', content: '我的座位上全是水，像，全是水！' },
      { date: '2025-03-16', content: '一定是水。' },
      { date: '2025-03-16', content: '让我们把它添加到智慧的话语中。' },
    ],
    // 您自己的链接信息
    applyTip: {
      name: theme.title,
      desc: theme.description || 'Null',
      url: 'https://astro-pure.js.org/',
      avatar: 'https://astro-pure.js.org/favicon/favicon.ico'
    }
  },
}

友链配置#

友链配置位于 public/links.json 文件中。

{
  "friends": [
    {
      "id_name": "cf-links",
      "desc": "朋友圈中包含的常见链接",
      "link_list": [
        { 
          "name": "Elysia",
          "intro": "嗨，你想我了吗？无论何时何地，Elysia 都会回报你所有的期待。",
          "link": "https://honkaiimpact3.fandom.com/wiki/Elysia",
          "avatar": "https://0.gravatar.com/avatar/"
          // 在这里你也可以留下一些其他字段作为备注
        },
      ]
    },
    {
      "id_name": "inactive-links",
      "desc": "不活跃或违规的朋友",
      "link_list": [] // 你可以暂时把一些不好的链接留在这里
    },
    {
      "id_name": "special-links",
      "desc": "其他特殊链接",
      "link_list": [] // 不是你朋友的特殊链接
    }
  ]
}

与 Friend-Circle-Lite 集成#

Friend-Circle-Lite ↗ 是一个精简版的友链应用，没有后端，仅使用 github action 运行。

它需要：

1. 一个启用了 github action 的 github 仓库。
2. 一个静态站点服务器，如 Vercel、Netlify、GitHub Pages 等。

此主题尚未集成它，将来也不会提供支持。但请放心，本文档将指导您集成它。

1. Fork Friend-Circle-Lite ↗。

2. 修改您 fork 的仓库中的 config.yaml：

   config.yaml

   spider_settings:
      enable: true
      json_url: "<your-site>/links.json"
      article_count: 4

   yaml

3. 转到 “Actions” 页面并手动运行工作流 “Friend Circle Lite” 以检查它是否正常工作。这也会在 “page” 分支中生成服务器文件。

4. 查看 文档 ↗ 将服务器文件部署到您的静态站点服务器。

5. 将 获取脚本文件 friendCircle.ts ↗ 添加到您项目的 src/plugins 路径中。

6. 将 样式文件 fc.css ↗ 添加到您项目的 src/assets/styles 路径中。

7. 在 src/components/pages/links/index.astro 中添加初始化代码：

   src/components/pages/links/index.astro

   ---
   const headings = [
      // ...
      { depth: 2, slug: 'small-circle', text: '小圈子' }, 
   ]
   ---
   
   <PageLayout>
      {/* ... */}
      <h2 id='small-circle'>小圈子</h2>
      <div id='friend-circle-lite-root' class='not-prose'>加载中...</div>
      <script>
         import '@/assets/styles/fc.css'
   
         import { FriendCircle } from '@/plugins/friendCircle'
   
         const fc = new FriendCircle()
         fc.init({
            private_api_url: '<your-fc-lite-server>',
            page_turning_number: 10,
            error_img: 'https://cravatar.cn/avatar/57d8260dfb55501c37dde588e7c3852c'
         })
         fc.load()
      </script>
   </PageLayout>

   astro

   code