【插件上新】邮件编辑器-可视化拖拉拽设计器
本帖最后由 phoben 于 2024-7-2 11:36 编辑"Unlayer邮件编辑器"是一个功能强大且易于使用的邮件编辑器插件，由 Unlayer 团队开发、超哥二开封装，基于Vue框架。
官方DEMO(英文)：vue-email-editor (vue-email-editor-demo.netlify.app)插件使用视频教程：Unlayer插件使用讲解_哔哩哔哩_bilibili插件下载地址：商品详情 (grapecity.com.cn)
经过一段时间的投入使用和测试，现在可以放心的给大家放出这个插件。
Unlayer是一个成熟的自定义邮件模板设计解决方案，这次超哥给大家做了精细的二开和封装
https://mallcdn.grapecity.com.cn/610f15fe61c68cbadfcaae0330d17efd_%E6%8F%92%E4%BB%B6%E4%BD%BF%E7%94%A8%E8%AE%B2%E8%A7%A3.mp4
先给大家看几个HTML邮件效果
我们经常收到一些大厂的邮件，它们都非常规范、漂亮，但是在活字格里，想要做出这样的邮件页面，是非常困难的。
超哥在之前的项目中，也尝试过使用Tiny编辑器、HTML编辑器、活字格页面导出.... 结果效果都不尽人意
主要原因，在于客户使用的邮件客户端种类非常多，有OutLook、FoxMail、QQ邮箱、网易邮箱、各种第三方客户端等等...
无论你本地编辑多好看的HTML，到了对方哪儿，就面目全非，这是因为不同的客户端使用的HTML渲染内核浏览器不同导致的。
Unlayer很好的解决了这个问题，因为它就是为了邮件而生，它能确保编辑出来的页面HTML代码，在所有邮件客户端都有一致的效果。
这是Unlayer的设计器界面
这是实际收到的效果
模板参数支持
内置AI
主要功能
[*]拖放式设计：允许用户通过简单的拖放操作来创建复杂的邮件布局，无需编写代码。
[*]模块化组件：提供多种预设的内容模块，如文本、图片、按钮、视频等，用户可以组合使用，快速生成邮件内容。
[*]实时预览：用户可以在编辑过程中实时预览邮件的最终效果，所见即所得。
[*]导出与导入：支持导出和导入邮件模板的 HTML 代码和 JSON 格式，方便模板的复用和分享。
[*]支持模板参数：开发者可以根据业务需求，预先定义好模板参数。
[*]邮件模板管理：提供对邮件模板的创建、编辑、删除、保存和加载功能。
特点优势
[*]简单易用：通过直观的拖放界面，降低了邮件制作的难度，无需编写复杂的 HTML 和 CSS 代码，即可设计出专业的邮件模板。
[*]高度灵活：丰富的预设模块，以及对自定义模块的支持，能够满足各种邮件设计需求。
[*]跨设备兼容：编辑器生成的邮件模板在不同设备和邮件客户端中都能良好显示，保证邮件的阅读体验。
[*]实时反馈：所见即所得的实时预览功能，使用户可以快速调整设计，提高制作效率。
[*]无缝对接活字格：与活字格各项API实现对接，支持图片自动上传、运行时命令、嵌入式单元格类型等。
最佳实践
[*]在活字格中建立数据表，用来存储用户设计的模板，字段包括：模板名称、模板数据、HTML数据、模板标签....；
[*]使用Mustache(或其他)模板引擎的语法，创建模板标签，用户只需要页面点击使用即可；
[*]发送邮件前对Mustache模板参数进行替换，例如：{{姓名}}替换成"超哥"；
Mustache模板引擎教程：教程传送门
本帖最后由 phoben 于 2024-7-3 19:49 编辑
Mustache模板引擎教程
https://gcdn.grapecity.com.cn/showtopic-222316-1-1.html
{:5_117:} 我爱大佬 测试了一下，上传了一个背景图片，图片保存方式选的Base64，发出去后图片不显示。是要把导出的HTML内容里的导出内容发出去就可以了吗？ 左一 发表于 2024-7-9 09:37
测试了一下，上传了一个背景图片，图片保存方式选的Base64，发出去后图片不显示。是要把导出的HTML内容里的 ...
是的，用的就是html内容，模板内容是json格式，是给设计器用的。 phoben 发表于 2024-7-9 10:09
是的，用的就是html内容，模板内容是json格式，是给设计器用的。
设计器图片保存方式选的Base64，收到的邮件是这样的
左一 发表于 2024-7-9 10:42
设计器图片保存方式选的Base64，收到的邮件是这样的
你可以看下html文件里，有没有图片 phoben 发表于 2024-7-9 10:53
你可以看下html文件里，有没有图片
有dome示例文件吗？ 左一 发表于 2024-7-9 12:03
有dome示例文件吗？
没有，自己一直在项目里用，目前没碰到你说的问题，你可以自己检查下html的内容 本帖最后由 无双经典 于 2024-7-9 13:17 编辑
强烈建议葡萄城来购买插件，即丰富了插件生态，也让更多的人参与开发插件，即造福活字格用户，也让活字格充满活力，提高产品竟争力:lol
页:
[1]
2