做了一个修改自 Pintree 的双语书签导航站

MiaoNav 是一个由浏览器书签一键生成的「精选工具网站导航页」，支持分类平铺、标签联动筛选、暗色模式、中英双语，并附带一个桌面可视化编辑工具。

需要特别说明的是，MiaoNav 并不是从零开发的项目，而是修改自开源项目 Pintree。它 fork 自 Pintree 仓库的 pintree-old-pages 分支，并在其基础上做了一套面向中文用户的产品化改造。

• 项目地址：https://github.com/cheng01315/miaonav/

• 在线演示：https://www.meowtool.com/miaonav/

• 无英语页面版本：https://github.com/cheng01315/miaonav/tree/v1.01_miaonav

• Fork / 修改自 Pintree：https://github.com/Pintree-io/pintree/tree/pintree-old-pages

核心功能特性

导航页面

• 中英双语：提供 index.html 和 en.html 两个同源页面，右上角一键切换，含 canonical / hreflang 声明。

• 分类平铺首页：9 大分类以 emoji 图标加站点数量统计呈现，侧边栏滚动联动高亮（scroll-spy），长列表浏览时自动定位当前分类。

• 标签联动筛选：支持二级标签和可展开的三级标签，每个区块默认预览 18 个站点，超出部分可进入「查看更多」详情页，详情页带面包屑和递归分组。

• 搜索功能：同时匹配网站标题与描述，移动端提供吸顶搜索栏与双列卡片布局。

• 暗色模式：偏好持久化到 localStorage，跨语言跳转时不闪烁。

• 图标本地化：站点图标全部存储在 assets/logo/ 目录，加载失败自动回退默认占位图。

可视化管理工具

MiaoNav 最大的差异化功能是配套的中文桌面可视化编辑工具（Website navigation tool/Website navigation tool.py）、英文桌面可视化编辑器（Website navigation tool EN.py）。这一工具是在 Pintree 原有数据模式基础上新增的，无需安装浏览器扩展、无需手写 JSON，即可批量管理导航数据。

• 导入/导出：支持导入导出 Excel（.xlsx）与 JSON 文件，表格化增删改查与排序。

• 一键导出：生成符合 Pintree 结构的 pintree.json，多源 favicon 自动下载并统一转为 PNG。

• 分类 emoji 设置：右键菜单可视化设置 emoji，导出时写入 JSON。

• 内置翻译：接入百度 / 腾讯翻译，支持增量翻译生成 pintree.en.json，边翻边落盘，中断可续翻。

• 网站图标下载：支持多API渠道下载网站图标

工具运行需安装依赖：pip install openpyxl requests pillow。

作为 Pintree 修改版，MiaoNav 的主要改动

快速开始

本地预览

由于页面通过 fetch 读取 JSON 数据，需要用本地 HTTP 服务打开，不能直接双击 HTML 文件：

python -m http.server 8000
# 中文页 http://localhost:8000/index.html
# 英文页 http://localhost:8000/en.html

使用桌面编辑工具

pip install openpyxl requests pillow
python "Website navigation tool/Website navigation tool.py"

导入现有 json/pintree.json 或 Excel 进行编辑，点击「导出 json」生成数据文件，刷新网页即可生效。

部署

MiaoNav 是纯静态站点，将整个目录上传到任意静态托管即可。所有本地资源均使用相对路径，部署在根目录或任意子路径下都能正常工作。

项目结构

miaonav/
├── index.html              # 中文导航页
├── en.html                 # 英文导航页
├── css/
│   ├── styles.css          # 自定义样式（.mn-* 系列 + 移动端适配）
│   └── tailwind.css        # Tailwind 构建产物
├── json/
│   ├── pintree.json        # 中文导航数据
│   └── pintree.en.json     # 英文导航数据
├── assets/
│   ├── logo.svg            # 站点 Logo
│   ├── og.webp             # 社交分享图
│   ├── favicon/            # 站点 favicon
│   └── logo/               # 各网站图标（本地 PNG）
└── Website navigation tool/
    ├── Website navigation tool.py # 桌面可视化编辑工具（Tkinter，中文界面）
    ├── Website navigation tool EN.py # 桌面可视化编辑工具（Tkinter，英文界面）
    ├── translation.py # 百度 / 腾讯翻译接口封装
    └── _translation_cache.json # 增量翻译缓存（运行时自动生成）

技术栈

MiaoNav 采用纯前端技术栈：HTML / CSS / JavaScript，数据格式为 JSON，通过静态网站托管部署。桌面编辑工具基于 Python Tkinter 构建，依赖 openpyxl、requests、Pillow 等库。