48 lines
2.2 KiB
Markdown
48 lines
2.2 KiB
Markdown
# Theme Configurator 插件
|
||
|
||
此插件演示如何通过后台插件的方式为 BlackFruit-UI 主题提供可配置能力，支持设置导航、页脚、站点信息、SEO、首页轮播以及右侧浮窗，并提供 `/console/v1/theme/config` 接口与前端联动。
|
||
|
||
## 功能
|
||
- 后台界面（`template/admin/index.html`）以 JSON 的形式集中维护所有主题参数；
|
||
- 接口 `GET/POST /{DIR_ADMIN}/v1/theme/config` 提供配置读取与保存；
|
||
- 前台接口 `GET /console/v1/theme/config` 输出与 `/console/v1/common` 相同结构的数据，BlackFruit-UI 可以直接接入；
|
||
- 插件安装时创建 `addon_theme_configurator` 表并写入默认配置。
|
||
|
||
## 目录
|
||
```
|
||
plugins/addon/theme_configurator
|
||
├── ThemeConfigurator.php # 插件主文件
|
||
├── controller/
|
||
│ ├── ThemeController.php # 后台 API
|
||
│ └── clientarea/ThemeController.php # 前台 API
|
||
├── model/ThemeConfigModel.php # 主题配置模型
|
||
├── template/admin/index.html # 后台可视化页面
|
||
├── route.php # 自定义路由定义
|
||
├── sidebar*.php # 前后台导航
|
||
├── auth.php # 权限配置
|
||
└── lang/zh-cn.php # 多语言
|
||
```
|
||
|
||
## 使用步骤
|
||
1. 将目录复制到业务系统的 `public/plugins/addon` 下；
|
||
2. 在后台启用插件，安装脚本会自动创建 `addon_theme_configurator` 表；
|
||
3. 进入“插件 > 主题配置”页（`index.html`），按 JSON 结构维护导航、SEO、轮播、侧边栏等；
|
||
4. 前端 BlackFruit-UI 请求 `/console/v1/theme/config` 以获取运行时配置。若需要兼容现有 `/console/v1/common`，可在 Nginx 或网关层做转发。
|
||
|
||
### banner 字段示例
|
||
```json
|
||
"banner": [
|
||
{
|
||
"title": "中小企业的云计算底座",
|
||
"description": "自定义文案",
|
||
"img": "/upload/banner-1.png",
|
||
"url": "/cloud.html",
|
||
"blank": false,
|
||
"button_text": "立即查看",
|
||
"button_link": "/cloud.html",
|
||
"button_blank": false
|
||
}
|
||
]
|
||
```
|
||
BlackFruit-UI 会在首页读取 `banner` 数组动态渲染轮播图，`url/blank` 控制整张 Banner 的跳转，`button_*` 控制右下角按钮。
|