如何为你的自托管应用栈构建统一的Theme.Park主题生态系统

如何为你的自托管应用栈构建统一的Theme.Park主题生态系统【免费下载链接】theme.parkA collection of themes/skins for 50 selfhosted apps!项目地址: https://gitcode.com/gh_mirrors/th/theme.parkTheme.Park是一个强大的开源项目为超过50种流行的自托管应用程序提供统一的美化主题和皮肤系统。无论你是运行媒体服务器、下载工具、监控系统还是其他自托管服务Theme.Park都能为你打造一致且美观的界面体验。这个终极指南将帮助你快速掌握Theme.Park的使用方法为你的自托管应用栈构建统一的视觉生态系统。什么是Theme.Park为什么需要它Theme.Park是一个专门为自托管应用设计的CSS主题集合支持包括Sonarr、Radarr、Plex、Jellyfin、qBittorrent、Portainer等在内的50多种热门应用。通过统一的主题系统你可以让所有自托管应用拥有协调一致的外观告别杂乱无章的界面风格。核心优势 ✨统一视觉体验为所有应用提供一致的设计语言多主题选择支持11种官方主题和24种社区主题简单部署通过Docker Mods轻松集成完全开源基于MIT许可证完全免费使用持续更新活跃的社区支持和定期更新支持的应用程序范围Theme.Park覆盖了自托管生态系统中几乎所有主流应用 媒体管理应用Sonarr- 电视剧自动下载和管理Radarr- 电影自动下载和管理Lidarr- 音乐自动下载和管理Readarr- 电子书自动下载和管理Prowlarr- 索引器管理Bazarr- 字幕管理 媒体服务器Plex- 主流媒体服务器Jellyfin- 开源媒体服务器Emby- 另一款媒体服务器 下载工具qBittorrent- BT下载客户端Transmission- 轻量级BT客户端Deluge- 功能丰富的BT客户端SABnzbd- Usenet下载工具NZBGet- 高性能Usenet下载器️ 系统工具Portainer- Docker容器管理Pi-hole- 网络广告拦截Netdata- 系统监控Grafana- 数据可视化Nginx Proxy Manager- 反向代理管理 安全与认证Authelia- 单点登录认证Bitwarden- 密码管理器LLDAP- 轻量级LDAP服务器主题系统详解官方主题选项Theme.Park提供了11种精心设计的官方主题每种都有独特的视觉风格Aquamarine- 蓝绿色渐变主题Dark- 经典深色主题Dracula- 流行的Dracula配色方案Hotline- 霓虹灯风格主题Hotpink- 粉红色调主题Maroon- 深红色主题Nord- 北极配色方案Organizr- Organizr风格主题Overseerr- Overseerr风格主题Plex- Plex风格主题Space Gray- 太空灰主题Aquamarine主题为你的应用带来清新的蓝绿色渐变效果社区主题除了官方主题还有24种社区贡献的主题可供选择包括Catppuccin系列Frappe、Latte、Macchiato、MochaBlackberry系列多种配色Rose Pine系列以及其他创意主题快速安装指南方法一Docker Mods安装推荐这是最简单快捷的安装方式适用于使用LinuxServer.io或Hotio容器镜像的用户# 以Sonarr为例 docker run -d \ --namesonarr \ -e PUID1000 \ -e PGID1000 \ -e TZAsia/Shanghai \ -e TP_THEMEdark \ -e TP_ADDONsonarr-4k-logo \ -p 8989:8989 \ lscr.io/linuxserver/sonarr:latest关键环境变量TP_THEME设置主题名称如dark、aquamarine等TP_ADDON启用附加组件可选TP_DOMAIN自定义主题域名默认为theme-park.dev方法二手动CSS注入如果你不使用Docker或需要更多控制权可以手动注入CSS在应用页面按F12打开开发者工具找到head标签添加以下链接link relstylesheet hrefhttps://theme-park.dev/css/base/sonarr/sonarr-base.css link relstylesheet hrefhttps://theme-park.dev/css/theme-options/dark.css方法三反向代理配置使用Nginx或Apache作为反向代理时可以通过subfilter注入CSSlocation / { proxy_pass http://sonarr:8989; sub_filter /body link relstylesheet hrefhttps://theme-park.dev/css/base/sonarr/sonarr-base.csslink relstylesheet hrefhttps://theme-park.dev/css/theme-options/dark.css/body; sub_filter_once on; }高级功能与定制附加组件AddonsTheme.Park为特定应用提供了附加组件进一步增强视觉效果Logo替换如sonarr-4k-logo、radarr-anime-logo深色模式增强如sonarr-darker、radarr-darker特殊功能如plex-alt-logo、organizr-glass自定义主题创建你可以创建自己的主题只需在css/theme-options/目录下添加新的CSS文件:root { --main-bg-color: #your-color; --button-color: #your-button-color; --text: #your-text-color; /* 更多自定义变量 */ }文件结构组织Theme.Park项目结构清晰便于理解和扩展theme.park/ ├── css/ │ ├── base/ # 各应用基础样式 │ │ ├── sonarr/ │ │ ├── radarr/ │ │ └── ... │ ├── theme-options/ # 官方主题 │ ├── community-theme-options/ # 社区主题 │ └── addons/ # 附加组件 │ ├── sonarr/ │ ├── radarr/ │ └── ... ├── docker-mods/ # Docker集成脚本 │ ├── sonarr/ │ ├── radarr/ │ └── ... └── resources/ # 图片和资源文件Unraid的Alien主题登录页面带来科幻电影般的体验实际应用场景场景一家庭媒体中心统一美化如果你运行Plex、Sonarr、Radarr、qBittorrent等媒体相关应用可以使用统一的Plex主题或Dark主题让所有界面风格一致提升使用体验。场景二服务器监控仪表板对于Portainer、Netdata、Grafana等监控工具使用Space Gray或Nord主题可以创建专业的监控仪表板所有指标一目了然。场景三个性化登录页面Unraid用户可以使用Theme.Park提供的Alien或Fallout主题登录页面打造独特的系统入口体验。Fallout主题为Unraid带来复古核战终端风格最佳实践与技巧1. 主题选择建议媒体应用推荐使用Plex、Overseerr或Dark主题技术工具Space Gray或Nord主题更专业个性化需求尝试Hotpink或Aquamarine主题2. 性能优化使用CDN加速https://theme-park.dev/css/...按需加载只为需要的应用启用主题缓存策略合理设置CSS缓存时间3. 故障排除主题不生效检查环境变量是否正确设置样式冲突禁用浏览器缓存后重试Docker问题确认使用支持的容器镜像4. 社区支持加入Discord社区获取实时帮助查看GitHub Issues寻找解决方案参与主题贡献和讨论结语Theme.Park为自托管应用生态系统带来了前所未有的视觉统一体验。通过简单的配置你可以将杂乱的应用界面转变为协调美观的工作环境。无论是家庭媒体中心、服务器监控面板还是开发工具栈Theme.Park都能提供合适的主题解决方案。开始你的主题美化之旅吧只需几分钟时间就能让你的自托管应用焕然一新。记住美观的界面不仅能提升使用体验还能让日常管理工作变得更加愉快。立即行动选择一个你最喜欢的应用尝试应用Theme.Park主题感受统一视觉体验带来的改变【免费下载链接】theme.parkA collection of themes/skins for 50 selfhosted apps!项目地址: https://gitcode.com/gh_mirrors/th/theme.park创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考