跳至内容

怎么在邮件模板中使用自己设计的HTML静态网页

绕过区块编辑器:Odoo电子邮件营销中自定义HTML的指南
2026年3月25日
怎么在邮件模板中使用自己设计的HTML静态网页
Chaofeng Wang


我们为什么可能想要这样做


标准的拖放电子邮件构建器足以满足基本的新闻通讯需求,但执行全球优先的商业战略需要对电子邮件的底层代码有绝对的控制。当面向全球企业客户时,营销电子邮件必须在像Microsoft Outlook这样的高度限制的传统客户端中完美呈现。这需要严格的基于表格的HTML和内联CSS,而所见即所得的编辑器往往会破坏这些代码。

要在Odoo的本地电子邮件营销应用程序中部署无懈可击的自定义HTML,您必须绕过标准区块,选择正确的基础画布,并直接与源代码接口。

以下是将自定义HTML注入Odoo电子邮件模板的标准操作程序(SOP)。


前提条件:启用技术接口


默认情况下,Odoo隐藏高级代码编辑器,以保护普通用户不破坏布局。要访问HTML注入工具,您必须提升会话权限。

  1. 导航到您的Odoo设置.

  2. 滚动到常规设置页面的最底部。

  3. 点击激活开发者模式。当开发者工具的“虫子”图标出现在您的顶部导航栏时,您就知道成功了。

Showing the top navigation bar with the bug icon

显示带有虫子图标的顶部导航栏


工作流程:注入HTML有效载荷


一旦开发者模式激活,电子邮件营销应用程序将为技术用户提供新的控制选项。您启动模板的顺序对于避免CSS冲突至关重要。

  1. 选择“从头开始”模板


  2. 导航到电子邮件营销应用程序并点击新建以创建一个活动。Odoo将展示一系列预构建的主题。选择从头开始模板至关重要。请勿选择预设计的布局。预构建的模板包含隐藏的Odoo结构类和内部CSS,这将不可避免地与您的自定义HTML冲突,当电子邮件遇到严格的企业防火墙或旧版邮件客户端时,会导致严重的渲染失败。


  3. Showing the "Start From Scratch" template selection circled in red

    显示红圈标记的“从头开始”模板选择


  4. 访问代码视图界面


  5. 一旦您的空白画布加载完成,请查看右侧设计面板顶部的工具栏。由于开发者模式已激活,您现在将看到</>(代码视图)按钮。点击此按钮以去除可视化构建器块占位符并访问DOM。


  6. Showing the Code View button circled in red

    显示红圈标记的代码视图按钮


  7. 注入自定义HTML


  8. 点击代码视图按钮将编辑画布转换为原始代码编辑器。将您经过充分测试的内联样式HTML直接粘贴到此窗口中。确保您的代码依赖于嵌套的<table>结构,而不是现代CSS网格或弹性盒子,因为Odoo的内部清理器和桌面电子邮件客户端将剥离不支持的现代CSS。


  9. Showing the raw HTML code pasted into the dark mode editor

    显示粘贴到深色模式编辑器中的原始HTML代码


  10. 验证渲染输出

  11. 要退出代码编辑器并确认Odoo的渲染引擎已接受您的HTML而未剥离必要的标签,请第二次单击</>(代码视图)按钮。界面将切换回视觉预览模式,让您准确查看结构元素、背景颜色和排版将如何显示给最终用户。


  12. Showing the rendered visual output of the custom HTML

    显示自定义HTML的渲染视觉输出


Odoo HTML注入的最佳实践


  1. 锁定结构:一旦您的自定义HTML在预览模式下正确渲染(步骤4),您可以使用视觉界面编辑文本或更新标准链接。然而,请不要将新的Odoo构建块(如“列”或“图像”)拖放到您的自定义布局中。将Odoo的基于flexbox的原生块与您的自定义基于表格的HTML混合会导致布局碎片化。

  2. 动态占位符:在使用自定义HTML时,您仍然可以利用Odoo的动态数据插入。在视觉预览模式下,突出显示您希望动态化的文本,输入/,然后选择动态占位符以注入后端数据库变量(例如,收件人姓名或公司数据)。


参考文献

  1. Cyr, Jason. "HTML电子邮件中的CSS终极指南。" Litmus. 最后修改于2025年1月15日。https://www.litmus.com/blog/the-ultimate-guide-to-css-in-html-email/.

  2. Odoo S.A. "群发邮件和市场营销自动化。" Odoo文档。访问于2026年3月26日。https://www.odoo.com/documentation/17.0/applications/marketing/email_marketing.html.

  3. Robles, Rene.Odoo开发基础。伯明翰:Packt Publishing,2023年。

Odoo
分析这篇文章
标签
存档
为什么全文翻译格式乱套了?怎么修复?
为了获得最佳效果,我们建议在创建博客文章的翻译之前,先完全确定其结构和样式。