问题 #3064💬 已回答提出于 2020年10月6日作者 terdinatore1 个反应

BUG:用GrapesJS制作的通讯在移动端渲染不好

快速解答作者 boomshakar1

解决这个问题的办法是将正文设置为100%宽度和高度,然后邮件容器本身的最大宽度为550px,宽度为100%,然后高度为自动,最小高度为100vh或150px ![截图(150)](https://user-images.githubusercontent.com/51333883/164299300-fa91dc3d-07f6-488e-81ed-e53cb8f7bd0c.png)

阅读下方完整回答 ↓

问题

版本: v0.16.22

你能重现演示中的bug吗? [X] 是的(通讯演示)

如何繁殖 导出默认模板或你自己的模板(导入后),然后用[](https://putsmail.com/)发送。用iPhone打开邮件。

预期的行为是什么? 发送到移动设备(我这里是iOS)时,邮件应该会使用整个显示宽度

详细描述那个漏洞** 我用Mailtrain发送通讯。Mailtrain集成了GrapesJS,帮助在发送邮件前可视化和编辑邮件。我通常导入一个在手机上运行良好的模板,让不熟悉HTML的人调整通讯内容。 在移动设备上打开已发送的通讯时,由于邮件不占用整个屏幕宽度,会损失大量空间。我猜这和默认应用在HTML代码中的“protectedCss”样式有关,比如“box-sizing: border-box”;以及幕后发生的其他更改。

我也在Mailtrain仓库上开了一个问题[Issue](https://github.com/Mailtrain-org/mailtrain/issues/973#issue-715739741)。在那里我稍微简要地解释了问题所在。

目前的行为是什么? 发送到移动设备的邮件两侧都有大白条。

回答(2)

artf2020年10月10日

你好@terdinatore GrapesJS的核心是创建用HTML/CSS/JS构建内容的编辑器,但是否构建合适的邮件模块/组件则取决于谁整合编辑器

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。