利用 homepage 打造好看的浏览器看板

https://appstore.lazycat.cloud/#/shop/detail/cloud.lazycat.app.homepage 话不多说，先看最终的效果图：  ## HomePage 配置 我们先来安装 HomePage。然后，通过开启**懒猫网盘**的 AppData，方便我们轻松地修改 HomePage 的配置。  点击左边栏 AppData，点进 homepage/config 目录，至此我们就来到了 HomePage 的配置根目录。其中以 yaml 后缀结尾的文件都是配置，它们负责管理不同的展示模块，后面我会演示 settings.yaml、services.yaml、bookmarks.yaml、widgets.yaml——但不是全部。如果你想了解这个应用的全貌，可以查看[官方文档](https://gethomepage.dev/configs/)。  ## settings.yaml settings 属于应用级配置，可设置例如：浏览器的 tab title、tab icon、打开 homepage 时的背景图等。例如我的配置是： ```yaml title: Mine description: 懒猫微服HomePage background: image: [图片连接] opacity: 50 blur: sm favicon: [图片连接] ``` 所呈现的效果：   ## services.yaml services 配置很强大，通常用来配置自建服务（在我们这里就是懒猫应用），可以展示服务的 icon、主页链接、服务状态（`ping:xxx`）……最后可以像官网的示例一般，变得非常酷炫：  - 见：https://gethomepage.dev/configs/services/#docker-integration 但我觉得够用就好，所以没有配置得很复杂，只是把自己常用的站点分成四类： - **常用应用**，如：bookstack、memos、gitea……都是懒猫应用； - **小工具**，如：HomePage官网、opengist、lychee、freeicon……有的属于懒猫应用，有的是公网站点； - **知识**（这个就不做过多介绍啦，就是常逛的站点）。 其配置如下（省略了部分配置，这里只做配置演示，大家按照自己的想法布局就好）： ```yaml - 常用应用: - bookstack: href: description: 记录系统笔记 - memos: href: description: 记录灵感 - 小工具: - HomepageConfig: href: description: Homepage本地配置 - Homepage官网: href: - 知识: - 知识星球: href: - 最近: # 二级嵌套 - Flutter核心技术与实战: href: ``` ## bookmarks.yaml bookmarks 顾名思义，其配置结构也很简单，支持缩写和站点的 icon。我的呈现效果如下：  对应配置： ```yaml - Developer: - Github: - abbr: GH href: https://github.com/ - Lazycat开发文档: - abbr: LZC href: https://developer.lazycat.cloud/ - AI: - ChatGPT: - abbr: GPT href: https://chatgpt.com/ - Gemini: - abbr: GMN href: https://gemini.google.com/app?hl=zh - Social: - Reddit: - abbr: RE href: https://reddit.com/ - Entertainment: - YouTube: - abbr: YT href: https://youtube.com/ ``` ## widgets.yaml widget 支持对接许多第三方应用，对应文档：https://gethomepage.dev/widgets/。这里挑个我以为最重要的来介绍——Search。默认 HomePage 里的搜索框使用 duckduckgo，但我想要 google，所以配置如下： ```yaml - search: provider: google focus: true showSearchSuggestions: true target: _blank ``` 效果：  ## Custom New Tab 最后，我希望每次在 google 浏览器中 new tab 就能默认打开 homepage 看板。这里推荐一个插件：[Custom New Tab](https://chromewebstore.google.com/detail/custom-new-tab/lfjnnkckddkopjfgmbcpdiolnmfobflj)。 在下图框中配置： https://homepage.${微服名}.heiyu.space/ 。