5 分钟把 copyparty 的默认界面改出自己的样子【免费下载链接】copypartyPortable file server with accelerated resumable uploads, dedup, WebDAV, SFTP, FTP, TFTP, zeroconf, media indexer, thumbnails all in one file项目地址: https://gitcode.com/GitHub_Trending/co/copyparty把整部影音库投到大屏上第一眼是 copyparty 默认那套深色列表你心里冒出来的第一句是不是能不能换成别的copyparty 的自定义主题不用碰源码一条启动参数或者一个 CSS 文件整页就变了。读完这篇你可以在 0–9 十个内置预设之间不重启切换用十来行 CSS 把自己的品牌色压上去给某个文件夹单独挂一张欢迎页避开改了不生效的 3 个高发坑30 秒先看到变化最短路径就一个参数--theme取 0 到 9每个数字对应设置面板里的一套预设classic、pm-monokai、hi-con、phi95 之类下拉菜单里直接印着名字copyparty /data/films --theme7刷新页面整站就换了一张脸。不想动启动参数也行右上角设置面板里有 theme 下拉框选一个立即生效服务不用重启。先记住一个区别面板里选的是这个浏览器的个人偏好存在 localStorage 里--theme参数才是所有人看到的默认值。下面讲机制时还会用到它。效果有了。接下来弄清到底动了哪几个旋钮后面自己改的时候不慌。机制速览改界面到底动了哪几个旋钮旋钮作用--theme 0..9启动时的默认主题编号--themes N设置面板里列出几个主题默认 10--css-browser URL给浏览器页面追加一份 CSS--js-browser URL追加一份 JSwebroot 下的.themes/放自定义主题 CSS 的惯例目录默认样式表--fg、--bg-u2等基础变量的定义处核心一句话整套界面配色挂在几十个 CSS 变量上一个主题就是一套不同的变量取值。浏览器页面完整的一套配色写在浏览器主样式 browser.css 里官方的 bsod 蓝屏主题 是怎么覆盖变量的示范答案打开对照着看一遍就明白了。机制清楚直接进真实场景。场景一客厅大屏上的影音站目标电视上三米开外文字、缩略图不能糊视频文件最好一眼认出来。步骤把 文件类型图标插件 复制到你共享目录下的plugins/里注意必须落在正在共享的目录内URL 才找得到它用高对比预设加图标插件启动copyparty /data/films --theme7 --css-browser /plugins/browser-icons.css改完长什么样高对比的文字排版视频文件带播放键小图标、音频文件带音符不用放大、不用猜扩展名。纯 CSS、零 JS一个参数的事。更多现成插件可以翻 插件资源说明。个人客厅搞定了再想想给全公司用的那份。场景二给团队共享套上品牌色目标内部分享站一眼看上去是你们公司的而不是默认深灰。步骤在共享目录下建.themes/目录点开头的目录不碍眼新建brand.css只覆盖几个核心变量。选择器要跟着主题编号走--theme9对应html.ey带参数启动copyparty /srv/share --theme 9 --css-browser /.themes/brand.css/* .themes/brand.css */ html.ey { --fg: #eef4f0; --fg-max: #fff; --bg: #10241d; --bg-u2: #10241d; --bg-u5: #24443a; --btn-bg: #24443a; --a: #6fd39f; }改完长什么样背景是深松绿文字米白链接与悬停态是品牌浅绿按钮底色跟着--btn-bg走。整站统一了品牌色没写一行 JS。整站统一之后你可能想更细一点——只让某一个文件夹开口说话。进阶一技给单个文件夹挂欢迎页copyparty 默认会扫描每个目录里的.epilogue.html把它嵌在该目录的文件列表下方不想要这个行为用--no-logues关掉即可。在目标目录里直接放文件就行!-- /media/.epilogue.html -- div stylemargin:0 0 1.5em;padding:.8em 1em;border:1px solid #456;border-radius:.5em b家庭影音库/bbr 新片丢进 codeinbox//code周五 20:00 自动归位 投屏卡顿先看 codevideo/1080p//code 目录。 /div它默认是被 sandbox 的写静态标记最稳妥。想换扫描的文件名用--epilogues welcome.html,notes.html传一个列表。上手之后有 3 个地方新手最容易卡住。避坑copyparty 自定义 CSS 改了不生效的 3 个原因症状加了--css-browser页面一点没变。原因URL 指向的文件不在被共享的目录里浏览器直接打开这个地址其实是 404。解决先单独访问 CSS 的 URL 确认能下载再谈样式。症状变量都写了一个都没生效。原因html的类名和主题编号对不上。8 是html.ez、9 是html.ey写成html.az就全白搭。解决先定编号再写选择器拿不准就按 F12 直接看 html 标签上的类。症状我在面板切了主题同事的页面还是旧的。原因面板选择存在他/她浏览器的 localStorage互不影响。解决要统一就写在启动参数--theme里面板留给个人微调。最后说两句主题定制说到底就三件事选编号、覆盖变量、按文件夹注 HTML剩下的只是配色审美。想看更多真实样例contrib 目录 里主题和插件都摆着写得顺手了按 CONTRIBUTING.md 把主题共享出去是最体面的回礼。你现在的部署里是哪一块界面颜色怎么调都不顺眼【免费下载链接】copypartyPortable file server with accelerated resumable uploads, dedup, WebDAV, SFTP, FTP, TFTP, zeroconf, media indexer, thumbnails all in one file项目地址: https://gitcode.com/GitHub_Trending/co/copyparty创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考