xnx_icon_gallery 图标库演示
前台图标浏览页:a,支持搜索、常规/实心分类与点击复制,供开发者与用户查阅。访问 /icons.htm。
功能
图标清单实时解析自
view/vendor/tabler-icons/tabler-icons.min.css,不独立维护列表,字体子集更新后页面自动同步分类筛选:名称以
-filled结尾为实心(filled),其余为常规(outline),分类按钮带数量徽章关键字搜索:按图标名本地过滤(如 home / heart),实时计数,无 AJAX
点击图标复制 class(如
ti-home),优先navigator.clipboard,失败降级execCommand('copy'),toast 反馈无匹配结果时显示空状态提示
接入发现页(DiscoverService,rank 120),前台导航可直达
纯展示插件:不建表、无后台设置,随装随用
文件结构
plugin/xnx_icon_gallery/
├── conf.json
├── install.php / uninstall.php # 留空守卫:无表、无配置
├── discover_register.php # 自注册到发现页,不改核心 DiscoverService.php
├── route/icons.php # /icons.htm:解析 CSS 得图标清单,分 outline/filled
├── hook/
│ ├── index_route_case_end.php # case 'icons' 路由分发
│ ├── model_route_table_end.php # $routes['icons'],url('icons') 生成伪静态地址
│ ├── lang_zh_cn_bbs.php
│ ├── lang_zh_tw_bbs.php
│ └── lang_en_us_bbs.php
├── view/htm/icons.htm # 独立工具页模板(header/footer 包裹,不用三栏骨架,居中铺满)
├── static/
│ ├── css/gallery.css
│ └── js/gallery.js # 原生 JS,无 jQuery 依赖
└── lang/
├── zh-cn.php / zh-tw.php / en-us.php
实现要点
服务端一次性渲染全部图标进 DOM,前端本地过滤,不依赖任何接口
静态资源 URL 用
filemtime作版本串,改动 JS/CSS 后浏览器自动拉新,无需手动 bump前端文案经模板
json_encode(HEX 转义)注入window.XIUNOX_GALLERY.lang,复制提示走XN.toast列表与用户输入均经
esc_attr/esc_html转义输出
配置流程
后台「插件管理」启用 xnx_icon_gallery
访问
/icons.htm(或从发现页进入)浏览图标,搜索筛选后点击复制 class 即可用于模板/插件开发如需扩充图标,用
tool/subset_tabler_icons.py重新子集化字体,图标库页面自动跟随更新

版本:v1.0.0
适用版本:1.1
开发者:贰先生





