跳转到内容
无痕工具库 无痕工具库

Hostinger Reach 邮件模板制作教程：HTML、AI 与设计工具详解

在 Hostinger Reach 中可以通过三种方式创建电子邮件模板：使用 AI 生成、从模板库中选择现成模板，或上传你自己的 HTML 代码。创建模板后，你可以在 AI 编辑器、设计编辑器和代码编辑器之间自由切换，继续编辑。

代码编辑器是高级功能，仅适用于 Reach 500 及更高级别的方案。如果你使用的是较低的方案，可能需要升级才能使用该功能。

开始创建电子邮件模板的方式

打开你的 Reach 控制面板，进入 Templates(模板)，然后点击 Create Template(创建模板)。

在 Reach 中创建新模板时，你可以选择以下起点之一：

  1. 使用 AI 创建：描述你想发送的内容，Reach AI 将在几秒钟内生成完整的电子邮件布局、设计和文案。如果你不确定从哪里开始，可以使用页面上显示的 AI 提示建议。AI 还会使用你保存的品牌信息，使模板与你的业务相匹配。如果你想根据创意、促销、活动、产品更新或电子简报主题快速创建营销活动，这是一个绝佳选择。
  2. 从模板库中选择模板：点击 Browse templates(浏览模板)打开 Reach 模板库。使用类别筛选器快速缩小模板范围，并在选择之前预览模板。找到你喜欢的设计后，可以原样添加，也可以在应用品牌信息后作为起点添加。添加模板后，你可以自定义文本、图片、按钮、区块、颜色和样式，以匹配你的品牌形象与要传达的内容。
  3. 上传 HTML 代码：如果你已经有 HTML 电子邮件模板，可以直接将其上传到 Reach 并继续编辑。如果你在 Reach 之外创建了自定义设计，或者想重复使用现有的 HTML 模板，这将非常有用。

在撰写营销活动或自动化电子邮件时，你可以设置自定义预头文本(pre-header)。预头文本会在收件人的收件箱中作为预览文字显示在主题行旁边。如果未设置预头文本，邮箱客户端可能会显示邮件正文的第一行或通用备用文案(例如“在浏览器中查看”)。设置预头文本的方法：打开电子邮件编辑器 → 找到 Pre-header(预头文本)字段 → 输入你的文本 → 保存。

在 AI、设计和代码编辑器之间切换

你的起点并不会限制你之后编辑模板的方式。创建模板后，你可以在 Reach 提供的三种不同编辑工具之间自由切换！

AI 编辑器

使用 AI 快速改进或更新你的模板。你可以指示 AI 执行以下操作：

  • 改进电子邮件布局
  • 调整电子邮件设计
  • 使用你当前的品牌信息更新模板
  • 修复电子邮件内容中的问题
  • 生成新图片

设计编辑器

当你想手动调整模板时，请使用设计编辑器。你可以使用此编辑器：

  • 编辑文本和图片
  • 使用 Rewrite This 改进选定的文本
  • 通过粘贴 YouTube 或 Vimeo 链接嵌入视频
  • 添加、复制、重新排序和删除区块
  • 从 Add section(添加区块)窗口的 Layout(布局)类别中添加预定义布局，例如“图文组合”和“三列图片”。所有六种布局请参阅如何在 Hostinger Reach 中手动编辑电子邮件模板
  • 更新按钮和链接，包括每个按钮各自的边框颜色和宽度
  • 更改样式
  • 添加个性化内容
  • 调整格式、边距、圆角等
  • 在一处设置应用于整个模板的全局模板样式

你无需逐个更新每个区块，而是可以在单个面板中设置应用于整个模板的样式。在 Edit(编辑)中，打开 Template styles(模板样式)，即可实时预览标题、正文文本和按钮样式，并调整：

  • 字体 — 标题与正文文本及按钮分别使用不同的字体系列
  • 颜色 — 模板背景、文本、按钮颜色、按钮文本、链接颜色和按钮边框
  • 按钮边框宽度(px)
  • 按钮圆角

该面板会预先填充你的模板当前使用的样式，因此你是在真实的起点上进行调整，而不是从零开始构建。这使你可以更快速地调整模板的整体风格以匹配你的品牌，因为你无需再逐个更新每个区块和元素。

代码编辑器

当你想直接处理模板的 HTML 时，请使用代码编辑器。你可以使用此编辑器：

  • 直接编辑 HTML 代码
  • 上传新的 HTML 文件
  • 替换现有的模板代码

使用代码编辑器编辑模板

代码编辑器允许你直接更新电子邮件模板的 HTML 结构。请按照以下步骤修改和保存你的代码：

  1. 在 Reach 中打开你的模板。
  2. 切换到 Code(代码)编辑器。
  3. 直接编辑 HTML 或上传新的 HTML 文件。
  4. 检查你的更改。
  5. 点击 Save changes(保存更改)。

保存更改时，Reach 会对你的 HTML 进行验证和准备，使其在电子邮件收件箱中正常工作。

保存代码编辑器更改时会发生什么

点击 Save changes(保存更改)后，Reach 会在应用更新之前检查你的 HTML。这可能需要几秒钟。

在此过程中，Reach 会对你的 HTML 进行验证和调整，以帮助确保：

  • HTML 结构适用于所有电子邮件客户端
  • 模板可以在不同的收件箱中正确渲染
  • Reach 退订链接存在且设置正确
  • 图片可以在模板预览中正常显示
  • 不安全或不受支持的元素得到妥善处理
  • 模板符合 Reach 的安全和发送要求

如有需要，Reach 可能会更新 HTML 结构的某些部分，以提高兼容性、保护退订功能，并帮助你的电子邮件对收件人正确显示。

HTML 模板的最佳实践

要在使用代码编辑器时获得最佳效果：

  • 使用专为电子邮件创建的 HTML，而不是普通网页的 HTML
  • 保持布局简洁且适合移动设备
  • 确保所有图片均已正确上传托管且可正常加载
  • 在发送给受众之前先测试你的电子邮件

无论你以哪种方式开始，你的 Hostinger Reach 电子邮件模板在通过营销活动发送之前，都可以在 AI、设计和代码编辑器中继续编辑。