电子邮件创作

在您将电子邮件资产添加到历程操作节点后,您可以定义电子邮件的内容。

在右侧面板的​ 详细信息 ​选项卡中单击​ 编辑电子邮件内容

单击“编辑电子邮件内容” {width="700" modal="regular"}

此操作将启动电子邮件设计工具,您可以在其中从以下选项中选择所需的电子邮件设计方式:

创建并个性化电子邮件内容后,可导出内容以供验证或稍后使用。 单击​ 导出HTML,将内容保存为.zip文件,其中包括您的HTML和资源。

TIP
使用由generative AI提供支持的Adobe Journey Optimizer B2B edition中的AI助手,将您的内容提升到新的级别。 AI Assistant可以帮助您优化投放的影响,方法是生成整个电子邮件、提供有针对性的文本内容,并为可与受众产生共鸣的图像获取AI Assistant推荐。 了解详情

从头开始设计您的电子邮件 design-from-scratch

使用可视内容设计空间来定义电子邮件的结构和内容。 通过简单的拖放操作添加和移动结构组件,您可以在几秒钟内设计可重用电子邮件内容的形状。

  1. 从​ 设计您的模板 ​主页中,选择​ 从头开始设计 ​选项。

  2. 在​ 创建电子邮件 ​对话框中,选择要创作的电子邮件内容类型。

    • 使用主题 — 选择此选项可在​ 主题模式 ​中创建电子邮件。 在此模式下,您可以使用定义的品牌主题来简化内容创作过程,并确保设计符合定义的标准。

    • 手动样式 — 选择此选项可在​ 手动模式 ​中创建电子邮件。 在此模式下,您可以手动为添加到空白画布的所有结构和内容组件设置样式。

  3. 将结构和内容添加到模板。

  4. 审阅并更新链接

  5. 测试电子邮件

如果对内容满意,请单击​ 保存

导入现有HTML内容

导入的内容可以是:

  • 具有合并样式表的HTML文件

  • 包含HTML文件、样式表(.css)和图像的.zip文件

    note note
    NOTE
    .zip文件结构没有限制。 但是,引用必须是相对的,并且适合.zip文件夹的树结构。 图像始终会上传到连接的Marketo Engage资源存储库。 如果要在Experience Manager Assets中管理图像文件,请单独在该应用程序界面中上传它们,并在Email Designer中更改图像链接。

要导入包含HTML内容的文件:

  1. 从​ 设计模板 ​主页中,选择​ 导入HTML ​选项。

  2. 拖放包含HTML内容的HTML或.zip文件,然后单击​ 导入

在zip文件中导入html内容 {width="500"}

NOTE
在HTML文件中使用<table>标记作为第一层可能会导致样式丢失,包括顶层标记中的背景和宽度设置。

您可以根据需要使用可视电子邮件编辑器工具个性化导入的内容。

选择模板

您可以从以下内容中进行选择:

  • 示例模板。 Journey Optimizer界面提供了20个现成的电子邮件模板,您可以选择这些模板。

  • 已保存模板。 使用您使用​ 模板 ​菜单从头创建的已保存自定义模板,或使用​ 另存为内容模板 ​选项从历程中的电子邮件中保存的自定义模板。

使用​ 选择设计模板 ​部分开始从模板构建内容。 您可以使用Journey Optimizer B2B Edition实例中的示例模板或保存的自定义电子邮件模板。

已保存模板

在​ 设计模板 ​主页上,默认选中​ 示例模板 ​选项卡。 要使用自定义模板,请选择​ 保存的模板 ​选项卡。

此时将显示在当前沙盒中创建的所有电子邮件模板的列表。 您可以按​ 名称上次修改时间 ​和​ 上次创建时间 ​对它们进行排序。

选择已保存的模板 {width="800" modal="regular"}

从列表中选择所需的模板。

选择后,这将显示模板的预览。 在预览模式下,您可以使用左右箭头在某个类别(示例或已保存,具体取决于您的选择)的所有模板之间导航。

预览保存的模板 {width="800" modal="regular"}

当显示与您想要使用的内容匹配时,单击预览窗口右上角的​ 使用此模板

此操作会将内容复制到可视内容设计器中,您可以在其中根据需要编辑内容。

示例模板

Adobe Journey Optimizer B2B Edition提供了一系列​ 现成的电子邮件模板,这些模板可用于创建电子邮件和电子邮件模板。

选择由Adobe提供的模板 {width="800" modal="regular"}

NOTE
保存的模板可能已将管理(内容锁定)设置应用于一个或多个组件。 当您从受控制的模板创作电子邮件时,可视设计空间提供了有关锁定的组件的准则。

添加结构和内容 structure-content

  1. 要开始内容设计,请从​ 结构 ​中拖动一个项,然后将其放到画布上。

    根据需要从​ 结构 ​添加任意数量的项,并编辑右侧窗格中每个项的设置。

    note tip
    TIP
    选择​_n:n列_​组件以定义您选择的列数(3到10之间)。 您还可以通过移动列下方的箭头来定义每列的宽度。

    将结构拖动到画布上并调整设置 {width="800" modal="regular"}

    每个列大小不能小于结构组件总宽度的10%。 只能删除空列。

  2. 展开​ 内容 ​部分,然后根据需要将任意数量的内容组件添加到一个或多个结构组件中。

    将内容元素拖到画布上并调整设置 {width="800" modal="regular"}

  3. 如果需要,您可以在​ 设置 ​或​ 样式 ​选项卡中为每个组件进行其他自定义。

    例如,可以更改每个组件的文本样式、填充或边距。

  4. 要添加条件内容并根据条件规则将内容调整到目标配置文件,请选择一个内容组件,然后单击组件工具栏中的​ 启用条件内容 ​图标。

    有关详细信息,请参阅​ 条件内容

添加自定义 CSS

您可以直接在电子邮件设计空间中添加自己的自定义CSS。 使用自定义CSS可应用高级和特定的样式,以便更加灵活地控制内容的外观。 最佳实践是在包含内容组件(如图像、按钮和文本)之前添加此最高级别的样式。

如果画布中至少有一个内容组件,请选择左侧导航树中的​ Body ​组件以访问自定义CSS编辑器。

NOTE
如果您的电子邮件是使用包含锁定内容模板设计的,则无法向内容添加自定义CSS。 按钮标签更改为​ 查看自定义CSS,内容中已存在的任何自定义CSS均为只读。

访问正文样式 {width="800" modal="regular"}

  1. 在右侧显示的​ 样式 ​选项卡中,单击​ 添加自定义CSS

    note note
    NOTE
    添加自定义CSS ​按钮仅在选择了​_正文_​组件时可用。 但是,您可以将自定义CSS样式应用于其中的所有组件。

    添加自定义CSS ​弹出编辑器显示占位符代码注释。

  2. 在编辑器中输入CSS代码。

    请确保自定义CSS有效并遵循正确的语法。 如果输入的CSS无效,则会显示一条错误消息,并且无法保存CSS。 若要了解详细信息,请参阅CSS有效期

  3. 单击​ 保存 ​以保存自定义CSS。

    自定义样式表应用于现有内容。 您可以检查自定义CSS是否已根据您的需求应用。 有关如何进行更改并调整样式表应用程序的信息,请参阅疑难解答

NOTE
如果删除所有内容,则CSS部分将不再出现在正文样式面板中,并且之前定义的自定义CSS将不再应用。 如果添加回内容,则会重新显示​ CSS样式 ​部分,并再次应用自定义CSS。

添加片段

NOTE
在电子邮件内容中的​_主题模式_​和​_手动模式_​之间,片段不交叉兼容。 要在应用主题的电子邮件内容中使用片段,还必须在​_主题模式_​中创建片段。

可视化片段是可重复使用的设计组件,它可以被Adobe Journey Optimizer B2B edition中的多个内容资源引用。 它通常是预先创建并快速插入的一个内容块,用于使创作更快捷、更一致。

以下示例概述了在创作内容时添加片段的步骤。

  1. 要打开片段列表,请选择​ 片段 ​图标( 片段图标 )。

    您可以:

    • 对列表进行排序。
    • 浏览、搜索或筛选列表。
    • 在缩略图和列表视图之间切换。
    • 刷新列表以反映任何最近创建的片段。

    从列表中选择片段 {width="700" modal="regular"}

  2. 将任意片段拖放到结构组件中。

    编辑器在电子邮件结构的部分/元素中呈现片段。

    note tip
    TIP
    要添加片段,以使其占据电子邮件中的整个水平布局,请添加1:1列结构,然后将片段拖放到其中。

    片段的内容会在结构中动态更新,以显示内容在内容中的显示方式。

recommendation-more-help

可自定义片段中的​ 可编辑字段

可视片段可以包含可自定义的可编辑字段。 自定义字段允许您在将片段合并到内容时修改参数,并创建量身定制的体验而不影响原始片段。 片段作者可以为文本、图像和按钮组件的自定义设计片段。 如果包含的片段包含具有可编辑字段的组件,则可以更改默认值以针对内容对其进行自定义。

  1. 选择片段组件。

    右侧显示的设置包括可编辑的字段,其中包含默认值。

    更改片段组件参数 {width="700" modal="regular"}

  2. 根据需要更改任何可编辑的字段。

保存电子邮件后,当您在摘要中选择​ 使用者 ​选项卡时,该电子邮件会显示在片段详细信息页面中。

添加图像资源

在可视内容编辑器中,选择左侧导航栏中的​ Marketo Engage Assets ( Marketo Engage Assets图标 )图标或​ Experience Manager Assets ( AEM Assets图标 )图标。 在资产选择器中,您可以直接选择存储在源库中的资产。

NOTE
如果您配置了 Adobe Experience Manager as a Cloud Services,当您的用户帐户具有所需的权限时,您就可以访问 Marketo Engage Design Studio 和 Adobe Experience Manager Assets as a Cloud Service 的存储库。这两个存储库是独立的,且不同步。您可以使用任一源中的图像资产。
  • 通过将图像资产拖放到结构组件中来添加新资产。

    将Marketo Engage资源拖动到画布上并调整设置 {width="800" modal="regular"}

  • 通过在画布上选择现有图像资源并单击图像源工具中的​ 选择资源 ​来替换该资源。

    从源库中选择资产 {width="600" modal="regular"}

有关使用源类型中的资产的更多信息,请参阅使用资产进行内容创作

导航图层、设置和样式

在可视化设计空间中使用内容时,可以使用导航树访问组件、列和内容元素。 单击左侧的​ 导航树 ​图标( 导航树图标 )以显示该树。

访问内容层 {width="800" modal="regular"}

以下示例概述了在具有列的结构组件内调整填充和垂直对齐的步骤。

  1. 直接在画布中选择结构组件中的列,或使用左侧显示的​ 导航树

  2. 在列工具栏中,单击​ 选择列 ​工具,然后选择要编辑的工具。

    也可以从结构树中选择它。 该列的可编辑参数显示在右侧的​ 设置 ​和​ 样式 ​选项卡中。

    可视化设计器中显示的 列组件 {width="800" modal="regular"}

  3. 要编辑列属性,请单击右侧的​ 样式 ​选项卡,然后根据需要进行更改:

    • 对于​ 背景,根据需要更改背景颜色。

      清除透明背景的复选框。 启用​ 背景图像 ​设置以使用图像作为背景,而不是纯色。

    • 对于​ 对齐方式,请选择​ TopMiddle ​或​ Bottom ​图标。

    • 对于​ 内边距,定义所有边的内边距。

      如果要微调边距,请选择​ 每边不同的边距。 单击​ 锁定 ​图标中断同步。

    • 展开​ 高级 ​部分以定义列的内联样式。

    更改选定列的样式 {width="700" modal="regular"}

  4. 如果需要,请重复这些步骤以调整组件中其他列的对齐和填充。

  5. 保存更改。

个性化内容

Journey Optimizer B2B edition使用内联简单语法,允许您创建包含用大括号{}括起来的个性化内容的表达式。 您可以在同一内容或字段中添加多个表达式,而不受限制。

示例:

  • Hello {{lead.firstName}} {{lead.lastName}}
  • Hello {%= lead.mktoName ?: "Marketer" %}
NOTE
Journey Optimizer B2B edition现在在电子邮件中遵循个性化令牌的​_驼峰式大小写_​语法,以匹配其他Adobe Experience Platform应用程序以获得一致的体验。 此令牌格式与Handlebars模板语言完全兼容。 在此更改之前添加的任何令牌都会自动更新。

处理内容时,Journey Optimizer B2B edition会将表达式替换为Experience Platform数据库中包含的数据。 因此,第一个示例变为​ Hello John Doe

以下示例概述了使用商机/帐户属性和系统令牌对内容进行个性化的步骤。

  1. 选择文本组件并单击工具栏中的​ 添加个性化 ​图标。

    单击“个性化”图标 {width="600"}

    此操作打开​ 编辑Personalization ​对话框。

  2. 通过单击令牌旁边的加号( +)符号添加令牌。

    如果要添加带有回退的令牌(当该字段不可用于潜在客户时显示的默认文本),请单击​ 更多 ​图标( ),然后选择​ 插入带有回退文本

    使用令牌构造个性化文本 {width="700" modal="regular"}

  3. 添加任何其他要包含的令牌或其他静态文本。

  4. 单击​ 保存

    个性化脚本显示在可视设计空间中。 您可以选择它以在需要时进行更改。

    选择个性化脚本 {width="600"}

NOTE
如果为帐户历程定义了​_我的令牌_,则还可以将这些特定于历程的令牌用于电子邮件内容。 有关详细信息,请参阅电子邮件个性化的自定义令牌

编辑链接的URL跟踪

  1. 单击左侧的​ 链接 ​图标( 显示链接图标 )可显示您的内容中要跟踪的所有链接URL。

  2. 如果需要,请单击​ 编辑 编辑图标 )图标并修改​ 跟踪类型 ​或​ 标签

    您还可以为链接添加​ 标记

单击“编辑”图标以访问链接跟踪 {width="500"}

应用深色模式样式

使用​ 深色模式 ​查看电子邮件客户端中深色主题的电子邮件显示。 深色模式或主题允许支持的电子邮件客户端或应用程序显示具有更暗背景和更浅颜色的电子邮件,用于文本、按钮和其他视觉元素。 在设计画布的右上方,将选择器更改为​ 深色模式 深色模式图标 )。 然后,预览和定义支持电子邮件的客户端在启用其深色主题时用于显示的特定自定义设置。

电子邮件设计画布显示深色模式选择器和以深色模式显示的电子邮件内容 {width="700" modal="regular"}

有关深色模式样式和最佳实践的详细信息,请参阅电子邮件内容的深色模式

查看选项

利用可视电子邮件编辑器中提供的视图和内容验证选项。

  • 通过预设缩放选项放大/缩小内容。

  • 切换在桌面、移动设备或纯文本/纯文本中查看内容。

    • 单击​ 查看 ​图标可跨设备预览内容。
    • 选择一个现成的设备或输入自定义维度以预览内容。

更多选项

从可视化设计空间顶部的​ 更多…… ​菜单中,可以执行以下操作:

单击“更多”以访问模板操作 {width="500"}

  • 重置电子邮件 — 单击此选项可将电子邮件设计画布清除为空白并重新启动内容生成。
  • 另存为片段 — 将电子邮件的全部或部分另存为片段,以便在多个电子邮件或电子邮件模板中重复使用。 您可以提供片段的名称和描述,并将其保存到可用片段列表中。
  • 更改您的设计 — 返回​ 设计您的电子邮件 ​页面。 从那里,您可以选择另一个模板以重新启动设计过程。 您还可以选择使用空白画布(经典模式)或使用品牌主题主题模式)从头开始设计内容。
  • 另存为内容模板 — 将电子邮件正文另存为电子邮件模板,以便在多个电子邮件或电子邮件模板中重复使用。 您可以提供模板的名称和描述,并将其保存到已保存电子邮件模板的列表中。
  • 导出HTML — 将可视画布中的内容以HTML格式下载到您的本地系统,并打包为zip文件。

检查并测试电子邮件 email-testing

定义消息内容后,您可以使用测试用户档案进行预览、发送校样以及查看其在桌面和移动设备宽高比中的呈现方式。 如果插入个性化内容,则可以使用测试用户档案数据预览此内容在消息中的显示方式。

预览电子邮件内容,请单击​ 模拟内容,然后选择一个测试个人资料以使用人员个人资料数据检查您的邮件。

模拟电子邮件内容以检查您的设计 {width="700" modal="regular"}

您可以访问其他工具来验证和查看电子邮件内容:

6ef00091-a233-4243-8773-0da8461f7ef0