源码介绍

一个无需数据库、后台可拖拽排序、全站 Emoji 图标的极简玻璃质感个人导航站。PHP 单文件架构，开箱即用。

更新日志

2026.4.22

新增卡片风格

集成 5 种来自 Uiverse 的创意卡片交互样式，每种均包含工具卡片与网址卡片的完整适配：

• 双层翻转：悬停时内容翻转切换，趣味性强。
• 边框发光：左侧渐变彩条 + 背景光晕，科技感十足。
• 扩散角标：右下角箭头悬停触发背景色扩散，引导点击。
• 圆形扩散：右上角圆点悬停放大，文字颜色同步过渡。
• 波浪动画：渐变波浪背景持续旋转，视觉动态活泼。
• 所有新增风格均支持 暗色模式 自动适配。

风格预览页面

• 新增独立风格预览 HTML 页面，可在后台切换前直观体验五种新样式的实际效果。

• 预览页包含昼夜切换按钮，便于测试亮/暗模式下的表现。

后台风格管理扩展

• 风格管理面板现支持 5 种基础风格 + 5 种 Uiverse 风格 共 10 种可选（若全部集成）。

• 选中风格后保存，前台立即生效，无需刷新。

技术优化

• 优化了工具卡片与网址卡片的 CSS 结构，使其更易于扩展新的交互效果。

• 修复了部分风格在移动端圆角不一致的问题。

2026.4.20

前台优化

• 新增工具卡片分页功能：每页最多显示 15 个工具，超出自动分页。

• 页码导航智能省略：当前页前后最多显示 3 个页码，首尾保留第 1 页和末页，其余用省略号替代。

• 卡片悬停动画优化，毛玻璃效果更精致。

后台工具管理升级

• 数字排序：每个工具增加 排序数字 字段，数字越小显示越靠前，后台列表可直观查看排序值徽章。

• 智能冲突处理：当手动设置排序数字与已有数字重复时，系统自动将原序列中大于等于该值的项依次后移，确保数字唯一且连续（如将第 9 项改为 1，原 1→2，原 2→3……）。

• 拖拽排序增强：拖拽手柄调整顺序后，排序数字自动重排为连续整数。

• 分页浏览：工具列表每页显示 10 条，支持翻页，页码逻辑同前台智能省略。

• 添加/编辑表单新增“排序数字”输入框（留空则自动分配至末尾）。

• 删除工具后自动重新整理所有排序数字。

交互与体验优化

• 修复后台“添加工具”按钮悬停时背景变白、字体不变黑的问题。

• 图标输入框移除默认填充字符，仅保留占位提示，方便直接粘贴 Emoji。

• 优化登录页界面，去除冗余密码提示，视觉更简洁。

  技术改进

• functions.php 中 readTools() 函数增加自动补全 sort_order 字段逻辑，兼容旧数据。

• 所有排序操作后均强制重新按 sort_order 升序排列，并调用 writeTools() 持久化存储。

• AJAX 排序接口增加数据完整性校验，失败时给出明确错误反馈。

核心亮点

1.玻璃质感 · 自适应双端

前台工具卡片采用毛玻璃 + 微阴影设计，悬停有上浮光效，视觉清爽柔和。布局完全响应式，手机/电脑均能获得舒适的网格体验。

2.后台可视化 · 拖拽排序

后台管理提供直观的侧栏分栏：工具管理、网站信息、修改密码。工具列表支持拖拽手柄调整顺序，松开即自动保存，告别繁琐的上下移动按钮。

3.纯 JSON 存储 · 无需数据库

所有工具数据和网站设置均保存为独立的 tools.json 与 settings.json 文件。无需 MySQL，备份只需拷贝两个文件，迁移成本几乎为零。

4.全站 Emoji 图标 · 轻量无依赖

图标全部采用 Emoji 字符，不依赖任何图标库。后台可直接粘贴任意 Emoji，前台展示统一生动，同时减少了外部资源加载。

5.网站信息实时自定义

后台“网站设置”面板可随时修改站点标题、SEO 关键词与描述，前台标题与 Meta 标签动态更新，满足个性化与搜索引擎优化需求。

6.一键重置 · 安全省心

后台提供“重置默认”按钮，可将工具列表恢复为初始精选集；修改密码功能让您可随时更换后台访问凭证，数据完全自主掌控。

截图演示