ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

phpMyAdmin 自定义主题开发完全指南:theme.json 元数据、主题目录结构与配置项解析

phpMyAdmin 自定义主题开发完全指南:theme.json 元数据、主题目录结构与配置项解析 数据库后端【免费下载链接】phpmyadminA web interface for MySQL and MariaDB项目地址https://gitcode.com/gh_mirrors/ph/phpmyadmin点击查看免费下载导读phpMyAdmin 原生支持第三方主题允许你在不修改核心代码的前提下为 MySQL / MariaDB 管理界面定制完整的视觉风格。本文以 docs/themes.rst 为主线结合仓库源码src/Theme/Theme.php、src/Theme/ThemeManager.php与实际主题文件public/themes系统讲解主题的配置方式、从零创建自定义主题的完整步骤、theme.json元数据的字段规范与校验规则以及图片资源的回退机制。读完本文你将能独立制作并部署一个被 phpMyAdmin 正确识别与加载的第三方主题。主题机制概述pmahomme 系统主题与第三方主题phpMyAdmin 将主题目录统一放在./public/themes/下每个子目录即一个独立主题。主题目录下必须包含可被加载的资源与元数据文件。当前仓库中随项目发布四个主题主题目录显示名称版本说明public/themes/pmahommepmahomme6.0默认系统主题fallback themepublic/themes/originalOriginal6.0经典 Original 主题public/themes/metroMetro6.0Metro 风格主题public/themes/bootstrapBootstrap6.0Bootstrap 风格主题其中pmahomme是系统主题system theme具有特殊的不可替代地位。原文档明确强调在./public/themes/下不应删除pmahomme目录或其底层结构。原因有两层向后兼容pmahomme包含全部图片与样式资源回退兜底凡是未自带图片或 CSS 的第三方主题都会自动借用pmahomme的资源。这一点在源码中得到明确印证src/Theme/ThemeManager.php 中定义了public const FALLBACK_THEME pmahomme;而 src/Theme/Theme.php 的checkImgPath()方法在主题自身没有img/目录时会直接回退到pmahomme的图片目录getImgPath()src/Theme/Theme.php在某个具体图片文件缺失时也会回落到./themes/pmahomme/img/。因此保留pmahomme是整个主题系统正常工作的前提。主题配置三个核心配置项主题的启用与选择由三个$cfg配置项控制定义位于 src/Config/Settings.php均可写入config.inc.php$cfg[ThemeManager]控制是否允许用户在界面上选择主题默认false$cfg[ThemeManager] true;若设为true登录后的主页面会出现主题选择器用户选中的主题会被保存在 Cookie 中Cookie 名为pma_theme见 src/Theme/ThemeManager.php下次访问自动生效若设为false所有用户都使用ThemeDefault指定的主题无法自行切换。$cfg[ThemeDefault]设置默认主题值为主题目录名即./public/themes/下的子目录名例如$cfg[ThemeDefault] pmahomme;该值必须是实际存在的主题。在 src/Theme/ThemeManager.php 的initializeTheme()中若默认主题不存在会抛出MissingTheme异常并提示Default theme %s not found!。$cfg[ThemePerServer]是否允许为不同的服务器配置使用不同的主题默认false$cfg[ThemePerServer] false;设为true后主题 Cookie 名会变为pma_theme-server编号见 src/Theme/ThemeManager.php从而按服务器分别记忆用户选择的主题。主题加载与 Cookie 生效流程从源码看主题初始化发生在 HTTP 中间件 src/Http/Middleware/ThemeInitialization.php 中每次请求都会执行ThemeManager::initializeTheme()其完整逻辑为src/Theme/ThemeManager.php从配置读取ThemePerServer并设置逐服务器主题开关调用loadThemes()扫描./public/themes/下所有子目录逐一尝试加载theme.json元数据成功者进入可用主题列表失败则跳过src/Theme/ThemeManager.php校验ThemeDefault指向的主题存在否则抛异常若 Cookie 中存在用户此前选择的主题pma_theme优先采用否则使用ThemeDefault若存在颜色模式 Cookiepma_theme_color见 src/Theme/ThemeManager.php进一步设置当前主题的颜色模式。创建自定义主题的完整步骤原文档给出创建主题的标准流程结合仓库中实际主题如 public/themes/original的目录结构完整步骤如下新建主题目录在./public/themes/下创建新子目录例如your_theme_namemkdir ./public/themes/your_theme_name拷贝基础文件将pmahomme主题下的文件与目录复制到新主题目录作为起点cp -r ./public/themes/pmahomme/* ./public/themes/your_theme_name/修改 CSS 文件编辑新主题css/目录下的 CSS 文件主题基于 SCSS 编译scss/目录下的分片文件如_variables.scss、_common.scss、_navigation.scss等即样式源参见 public/themes/pmahomme/scss放置新图片将自定义图标与按钮放入新主题的img/目录编辑_variables.scss修改 public/themes/pmahomme/scss/_variables.scss 对应的新主题副本调整配色、字体等主题变量编写theme.json在新主题目录中创建并填写主题元数据字段规范见下节生成截图为主题制作一张截图保存为your_theme_name/screen.png用于主题选择器与官网展示。完成上述步骤后只要theme.json内容合法该主题就会在loadThemes()扫描时被自动识别并出现在主题列表中。theme.json 主题元数据规范主题元数据集中存放在主题目录下的theme.json文件中。自 phpMyAdmin 4.8.0 起原先存放于info.inc.phpPHP 代码的元数据被theme.json纯 JSON取代以降低解析成本、无需执行 PHP 代码并支持更多附加特性。当前theme.json包含以下字段字段类型是否必填说明namestring必填主题显示名称versionstring必填主题版本号格式较自由不必与 phpMyAdmin 版本一致descriptionstring必填主题描述用于网站展示authorstring必填主题作者名称urlstring可选主题作者网站链接便于用户获取支持supportsstring[]必填支持的 phpMyAdmin 大版本号列表colorModesstring[]可选6.0 新增支持的颜色模式列表首项为默认模式原文档给出的经典示例对应 phpMyAdmin 4.8 时代为{ name: Original, version: 4.8, description: Original phpMyAdmin theme, author: phpMyAdmin developers, url: https://www.phpmyadmin.net/, supports: [4.8] }而当前仓库中四个主题的theme.json实际内容均为 6.0 版本格式例如 public/themes/original/theme.json{ name: Original, version: 6.0, description: Original phpMyAdmin theme, author: phpMyAdmin developers, url: https://www.phpmyadmin.net/, supports: [6.0], colorModes: [light] }仓库中的主题还展示了colorModes字段的实际用法public/themes/bootstrap/theme.jsoncolorModes: [light, dark]提供明暗双色模式public/themes/metro/theme.jsoncolorModes: [win, teal, redmond, blueeyes, mono]提供五种配色变体。theme.json 的源码级校验规则src/Theme/Theme.php 的loadInfo()方法实现了对theme.json的严格校验可作为开发自定义主题时的验收清单文件必须存在且可读theme.json缺失或file_get_contents失败主题加载失败必须是合法 JSON 对象json_decode结果必须为数组否则加载失败必填字段检查name、version、supports三个字段缺失即判定无效supports必须为数组且必须包含当前 phpMyAdmin 的大版本号通过Version::SERIES比对见 src/Theme/Theme.php——当前版本为 6.0因此supports中必须含有6.0否则该主题不会被识别colorModes校验可选增强若提供该字段则必须是非空字符串数组否则静默忽略并回退到默认[light]src/Theme/Theme.php。此外loadInfo()使用filemtime做缓存判断src/Theme/Theme.php同一请求生命周期内若文件修改时间未变化则直接复用已加载信息避免重复解析 JSON。仓库对应的单元测试 tests/unit/Theme/ThemeTest.php 覆盖了上述路径主题目录不存在时loadInfo()返回falsetestCheckImgPathNotExisted、非法主题元数据被拒绝testCheckImgPathIncorrect、合法的original主题被成功加载并解析出名称与版本testLoadInfo、testCheckImgPathFull。图片资源共享不提供 img 目录时的回退原文档特别说明如果你的主题不想使用自己的图标与按钮直接删除主题目录下的img/目录即可phpMyAdmin 会自动使用系统主题pmahomme的默认图标与按钮。这一行为的源码实现同样位于 src/Theme/Theme.php 的checkImgPath()若当前主题存在img/目录则使用自己的图片路径若不存在则回退到ThemeManager::FALLBACK_THEME即pmahomme的img/目录若连pmahomme的图片目录也不存在则抛出InvalidImagePath异常。这意味着第三方主题可以只做配色、不画图标大幅降低主题开发成本。同时也再次说明务必保留pmahomme主题的完整性它是所有主题的图片兜底。主题应用的实际路径与资源组织从 src/Theme/ThemeManager.php 可见主题目录的定位逻辑为文件系统路径固定为ROOT_PATH . public/themes/URL 路径为./themes/。因此主题资源CSS、图片、JavaScript均通过./themes/主题名/...相对路径对外暴露。getThemesArray()src/Theme/ThemeManager.php会将每个可用主题的id、name、version、is_active、color_mode、color_modes整理成数组供主题选择器渲染与 Cookie 写回使用。在 Twig 模板中可通过image()函数注册于 src/Theme/ThemeManager.php引用主题图片配合上述回退机制保证图片缺失时自动降级到pmahomme。常见问题与排查建议主题没有出现在主题选择器中依次排查theme.json是否存在于主题根目录且为合法 JSONsupports数组是否包含当前 phpMyAdmin 大版本号如6.0必填字段name、version、supports是否齐全src/Theme/Theme.php主题目录名是否包含非预期字符目录名即主题 id见Theme::load()的$themeName参数。修改主题后没有生效确认是否已重新编译 SCSS样式源在scss/参见 public/themes/pmahomme/scss并清除浏览器 Cookie 中的pma_theme缓存同时注意loadInfo()对theme.json的 mtime 缓存逻辑只在单次请求内有效刷新页面即可读到最新元数据。图片显示为默认图标说明主题缺少img/目录或缺少对应图片文件系统已自动回退到pmahomme的图片src/Theme/Theme.php。若需完全自定义图标请补齐img/目录下对应的图片文件。小结phpMyAdmin 主题系统由目录扫描 theme.json元数据校验 pmahomme兜底回退三部分构成。开发自定义主题时只需在./public/themes/下建立含theme.json、样式与可选图片的目录并确保元数据通过 src/Theme/Theme.php 的校验即可。配置侧则通过$cfg[ThemeManager]、$cfg[ThemeDefault]与$cfg[ThemePerServer]三个选项控制主题的启用、默认与按服务器记忆行为。理解 src/Theme/ThemeManager.php 的初始化流程与pmahomme的回退机制是排查主题加载问题、打造高质量第三方主题的关键。赞分享数据库后端【免费下载链接】phpmyadminA web interface for MySQL and MariaDB项目地址https://gitcode.com/gh_mirrors/ph/phpmyadmin点击查看免费下载相关推荐掌握WordPress Gutenberg主题开发theme.json v2配置完全指南掌握WordPress Gutenberg主题开发theme.json v2配置完全指南 WordPress Gutenberg主题开发中theme.jso后端前端Gutenberg 主题开发指南theme.json 全局设置与 add_theme_support 主题支持详解Gutenberg 主题开发指南theme.json 全局设置与 add_theme_support 主题支持详解 块编辑器Block Editor为主题后端前端IconPark主题配置终极指南JSON文件结构与自定义主题详解IconPark主题配置终极指南JSON文件结构与自定义主题详解 IconPark是一个功能强大的开源图标库能够将SVG图标转换为多种主题风格并生成Rea前端UI组件上一篇Ruby测试性能分析工具箱test-prof下一篇Video2X 免费视频超分辨率3 步把 360P 老视频拉到 4K附 AI 补帧实操创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表