Fragmenta CMS主题开发教程：只需一个配置键即可覆盖模板与静态资源

Fragmenta CMS主题开发教程只需一个配置键即可覆盖模板与静态资源【免费下载链接】fragmenta-cmsA user-friendly CMS written in Go (golang)项目地址: https://gitcode.com/gh_mirrors/fr/fragmenta-cmsFragmenta CMS 是一款用 Go (golang) 编写的用户友好型内容管理系统。本教程带你完整走一遍 Fragmenta CMS 主题开发流程只需在fragmenta.json配置中加一个theme键你写的主题模板与静态资源就会自动覆盖 App 同路径的官方文件全程无需修改任何 Go 代码。为什么用主题覆盖而不是直接改源码直接改src/目录下的模板和样式每次升级都会丢失你的改动。而 Fragmenta CMS 的主题机制把「你的定制」和「官方代码」完全隔离✅ 官方代码保持原样升级零冲突✅ 只覆盖你关心的文件没写的部分自动回落到官方默认✅ 模板和静态资源CSS / JS用同一套规则一处生效核心原理同路径覆盖机制Fragmenta CMS 启动时会做两件事相关代码都在 src/app/app.go 中加载模板先加载src/下的默认模板再把主题目录themes/主题名/src追加到模板路径列表末尾见src/app/app.go#L163-L176。同名模板后者生效即主题模板覆盖官方模板。编译静态资源默认编译src下的资源到public/若设置了主题还会编译一次主题目录见src/app/app.go#L144-L151。同名的 CSS / JS 文件主题版本会覆盖官方版。主题的入口由 src/app/app.go 中的themePath()函数src/app/app.go#L208-L214解析读取配置项theme拼出路径themes/主题名/src。也就是说——配置键的值必须等于themes/下的文件夹名。三步快速开始启用你的第一个主题第一步获取项目代码git clone https://gitcode.com/gh_mirrors/fr/fragmenta-cms第二步创建主题目录在themes/下新建你的主题文件夹内部结构只需一个src/再按需要放置模板和资源themes/ └── my-theme/ └── src/ ├── views/ # 你的模板.html.got 文件 └── assets/ ├── styles/ # 你的 CSS └── scripts/ # 你的 JS第三步写入一个配置键编辑secrets/fragmenta.json首次运行项目会自动生成见 src/app/bootstrap.go 的generateConfig()在对应环境的配置段里加一个theme键{ development: { port: 3000, theme: my-theme } }重启服务启动日志里出现loading templates for theme即表示主题已生效。就这么简单——这就是官方 README.md 中Theme一节描述的全部机制。如何覆盖模板复制同名文件即可模板按「目录 文件名」定位。想改哪里就把官方同名文件复制到主题里再修改。示例更换顶部导航。官方导航模板在src/app/views/header.html.got你在主题中创建同路径文件即可接管themes/my-theme/src/views/header.html.gotnav ul lia href/首页/a/li lia href/blog博客/a/li lia href/about关于我们/a/li /ul /nav其他常用模板位置可参考官方目录结构页面整体骨架src/app/views/layout.html.got页头 meta 信息src/app/views/meta.html.got引入样式/脚本的入口src/app/views/includes.html.got文章列表页src/posts/views/index.html.got 小技巧覆盖includes.html.got一次就能全站替换 CSS 和 JS 的引用比逐个改页面高效得多。如何覆盖静态资源同名文件自动生效把主题里的src/assets/编译后输出到public/目录因此想在官方样式基础上加主题色 → 在themes/my-theme/src/assets/styles/app.css中写样式同名会覆盖官方src/app/assets/styles/app.css想替换首页 Logo → 覆盖public/assets/images/app/logo.png对应的源文件即可官方资源文件如public/assets/styles/normalize.min.css依然可用主题没覆盖的部分全部保留主题目录速查表你想做的事在主题中放置的文件改全站页面骨架src/views/layout.html.got改顶部导航src/views/header.html.got改页脚src/views/footer.html.got改样式src/assets/styles/app.css改交互脚本src/assets/scripts/app.js新增页面模板对应模块的src/模块/views/xxx.html.got常见问题排查Q1配置了theme但主题没生效确认三件事配置值与themes/下的文件夹名完全一致主题内部必须有src/子目录修改后重启了服务模板与资源均在启动时加载。Q2模板名找不到模板引用形如{{ template app/views/header.html.got . }}见src/app/views/layout.html.got。覆盖时保持相对路径一致即可不用管前缀。Q3如何回退到默认外观删掉fragmenta.json中的theme键或置空并重启themePath()会返回空路径系统自动回落到官方模板与资源。小结Fragmenta CMS 的主题开发可以概括为一句话themes/下建文件夹配置里加theme键同名文件即覆盖。模板、CSS、JS 共用同一套规则上手成本低、升级无冲突非常适合想给站点换肤的开发者从修改header.html.got和app.css两个文件开始练手。【免费下载链接】fragmenta-cmsA user-friendly CMS written in Go (golang)项目地址: https://gitcode.com/gh_mirrors/fr/fragmenta-cms创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考