Odoo 19 产品详情页自定义 Tab 块完整指南
1. 需求场景
在产品详情页添加统一的 图片展示 | 性能指标 | 应用工具 标签页,每个产品自动显示。
- 图片展示:固定占位(后期可更新为视频/图文/表格)
- 性能指标:动态绑定后台自定义字段,后台改一处全局生效
- 应用工具:固定占位(如“敬请期待”)
核心原则:不动服务器、不动容器,前台编辑器就能搞定。
2. 后台操作:新建自定义字段
进入 设置 → 技术 → 字段,新建字段:
| 配置项 | 填写内容 |
|---|---|
| 字段名称 | x_specs(必须以 x_ 开头) |
| 字段标签 | 性能指标 |
| 模型 | product.template |
| 字段类型 | Html |
保存后去产品表单的 “自定义字段” 标签页把该字段拖到显眼位置。
3. 前台操作:创建全局构建块
- 打开任一产品页面,点击右上角 编辑
- 从右侧构建块列表拖入 “选项卡” (Tabs)
- 三个标签页分别命名为:图片展示 / 性能指标 / 应用工具
- 编辑好各自的占位文案(“图片展示”写“请添加图文”,“应用工具”写“敬请期待”,“性能指标”先留空)
- 选中整个选项卡外框,点击右侧面板的 “保存为区块” ,命名为
产品Tab块 - 保存后,在右侧“自定义”分类下就能看到它,其他产品页直接拖入即可
后期更新方法:改好内容 → 重新保存为同名片段 → 确认“覆盖”,以后拖入的都是新版。
4. 动态字段绑定(嵌入代码)
在 “性能指标” 标签页里:
- 删掉里面所有内容
- 从“结构”分类拖入 “嵌入代码” (Embed Code)构建块
- 在代码编辑区粘贴:
html
<div t-if="product.x_specs" t-field="product.x_specs"/>
- 后台填了内容就显示,没填就不显示
5. 最安全的前台操作黄金法则
- 保存为片段:一次做好,永不重复劳动
- 动态内容用嵌入代码块:不碰模板,出错秒删
这篇指南源自长达 5 小时的踩坑,所有错误都替你犯过一遍了,希望你一路顺畅。