支持提示:如何构建Zendesk电子邮件模板,以便为您的多个品牌使用亚博自定义HTML布局
2019年11月25日更新:在本教程底部添加了下载工作多品牌模板示例的链接。
下面是如何构建Zendesk提供的一个电子邮件模板,以支持多个品牌,以便发送的电子邮件对每个品牌都是独一无亚博二的(颜色,徽标,字体,格式等)。
目标:
- 一个HTML电子邮件模板配置支持每个品牌独特的页眉和页脚内容(不仅仅是标志艺术和标签行)。
- 完全控制电子邮件的内容,包括不同类型和数量的内容(高于和/或低于正文区域)(除了品牌)。
- 对几十个或更多的触发器没有任何负担,否则必须加载头HTML,并且在模板更改时必须反复编辑。(亚博Zendesk的例子让你在每个触发器中放置徽标和其他HTML)。
- 不需要为每个品牌克隆触发器,否则就需要提供品牌电子邮件。
- 适用于所有浏览器(web邮件)以及本机Mac和Windows电子邮件客户端(Outlook for Windows因HTML模板问题而臭名昭著)。
- 响应式设计适用于台式机、笔记本电脑、平板电脑和移动电话。
要求:
- 亚博Zendesk支持企业(最多5个品牌)或支持企业与多品牌附加组件(最多300个品牌)。
- 完成/测试的基于HTML的页面(电子邮件模板)。每个牌子一个。(或者使用本教程底部包含的示例模板)。
建议:
- 如果可能的话,让你的每个品牌的HTML邮件页面使用相同的核心框架,CSS等。虽然这不是必需的,但它将节省调试时间,并使将来的编辑更容易。
警告(可能):
- 我不知道Zendesk在邮件模板中接受的最大HTML文件大小,但我们的已经是52KB了,它可以工亚博作。
为了使您的生活更轻松,并满足最后两个目标,您必须从每个品牌的完全测试的HTML页面开始,然后将其用作Zendesk电子邮件模板中的组件。亚博本文不涉及HTML页面的创建,只是说您希望在开始将它们“拆分”到Zendesk的电子邮件模板中以支持多个品牌之前,在所有浏览器、客户端和用户可能拥有的设备类型中测试每个HTML电子邮件页面。亚博这将为您节省大量的测试时间和头痛。
让这个工作的关键是,我们需要一个电子邮件模板的方式来“知道”哪个品牌的电子邮件属于。这个问题的答案来自Luiza gusm
{{footer}}返回的实际文本如下:
此邮件是[您的品牌名称]提供的服务。
其中[您的品牌名称]是在每个品牌的“品牌名称*”文本字段中找到的文本。
这样,你就可以使用Liquid markup的'case'和'when'语句来触发{{footer}}的值来改变电子邮件模板中使用的HTML,以匹配你想要的每个品牌。经过我自己的多次尝试和错误测试,以下是为任何品牌创建电子邮件模板的大纲。
电子邮件模板的使用说明如下:
更新:下载更详细和更简单的模板的链接包含在本教程的底部。这些是为您定制您的品牌准备的工作示例。
将所有示例[html/text]替换为该对象的实际html和/或文本。
{{placeholder}}和{% code %}块保持在原来的位置。
。
< !——启动模板——>
[HTML < HTML >
部分和开始 HTML需要在分隔符占位符之前。]{{分隔符}}
{%大小写页脚%}
{%当“此电子邮件是来自[您的品牌名称a]的服务”。' %}
< !——Luiza的例子中缺少的是“。’,就在结束单引号之前。没有这段时间你就找不到匹配。-->
[HTML Body Brand A - specific header HTML -例如logo和其他模板内容]
{%当“此电子邮件是来自[您的品牌名称B]的服务”时。' %}
[HTML Body Brand B -特定的标题HTML -例如徽标和其他模板内容]
< !——当…时重复{%%}和[HTML]标头对。-->
{% else %}
[HTML正文通用介绍HTML(适用于代理/组)]
< !虽然这是可选的,但它确实使来自触发器的代理/组通知电子邮件看起来正确,带有样式的页眉和页脚。如果您选择省略它,也要删除它上面的{% else %}行。这并不一定是“通用”的HTML,它可以是你的主要品牌的副本,或者你的企业标识。因为发送给代理的电子邮件将有一个共同的页眉和页脚,所以我将Zendesk占位符{{ticket.brand.name}}放在每个发送给代理/组的电子邮件的Trigger的顶部。亚博-->
{% endcase %}
{{内容}}< !——这当然是电子邮件的主体,来自你定义的触发电子邮件主体部分。-->
{%大小写页脚%}
{%当“此电子邮件是来自[您的品牌a]的服务”时。' %}
[HTML Body Brand A特有的页脚HTML,包括结束页 HTML >]
< !这个HTML块也可以包含实际的{{footer}}占位符。-->
{%当“此电子邮件是来自[您的品牌B]的服务”时。' %}
[HTML Body Brand B -特定的页脚HTML,包括结束页 HTML >]
< !这个HTML块也可以包含实际的{{footer}}占位符。-->
< !——当…时重复{%%}和[HTML]页脚对。-->
{% else %}
[HTML正文通用页脚HTML,包括结束页 HTML >]
<——我建议您在这里的HTML中包含{{footer}}占位符,因为它为代理提供了额外的票证信息。同样,这个部分是可选的,如果要删除它,也要删除上面的{% else %}行。-->
{% endcase %} <——这是电子邮件模板的最后一行。-->
< !——END模板——>
发送给抄送用户的电子邮件(在Admin > Settings > ticket > CC中定义)将使用有效的品牌HTML。与触发器一样,cc设置中定义的信息将替换{{content}}块。
正如我在上面的代码注释中提到的,发送给Full Agents, Light Agents和Groups的电子邮件并不是针对您拥有的每个品牌进行样式设置的。(如果存在的话,我还没有找到一种方法来为每个品牌的代理邮件设置样式)。有了这个模板,发送给代理商和集团的电子邮件将在所有品牌中有一个共同的外观,因为这些电子邮件使用模板{% else %}部分中的HTML设置。
如果你选择不包括{% else %}部分中的“通用”HTML,那么你发送给代理/组的电子邮件将只包含触发器{{content}}块中的内容。
要解决这个问题,并确定发送给代理/组的每个电子邮件属于哪个品牌,您必须在发送给代理/组的每个触发器中添加品牌名称。为每个代理/集团邮件标记一个品牌,请执行以下操作:
邮件主题:[{{ticket.brand.name}}] re: {{ticket.title}}
邮件正文:{{ticket.brand.name}}
记住,这只需要用于将电子邮件发送到代理/组的触发器,您不必为向用户发送电子邮件的触发器这样做,因为电子邮件模板中的HTML会这样做。
假设:
我上面的多品牌电子邮件模板示例过程假设您可以开发HTML
部分以支持所有品牌。如果不是这种情况,那么可以对HTML 部分执行与对其他部分相同的操作。在上面的电子邮件模板大纲的顶部,用以下代码块替换{{delimiter}}上面的所有内容:< !——启动模板——>
{%大小写页脚%}
{%当“此电子邮件是来自[您的品牌名称a]的服务”。' %}
[品牌A的HTML < HTML >
部分和开始 HTML需要在{{delimiter}}之前]{%当“此电子邮件是来自[您的品牌名称B]的服务”时。' %}
[品牌B的HTML < HTML >
部分和开始 HTML需要在{{delimiter}}之前]< !——当…时重复{%%}和[HTML]对每一个额外的品牌。-->
{% else %}
[HTML < HTML >
sections and begin 'generic' HTML]{% endcase %}
建议:
为了与客户端电子邮件应用程序,桌面浏览器,移动浏览器,特别是Microsoft Outlook for Windows/Office 365完全兼容,你需要完全测试你的HTML电子邮件模板,以确保它呈现你想要的方式,然后再将其分割成Zendesk电子邮件模板的部分亚博
为了在应用程序和平台之间获得最广泛的兼容性,并拥有一个很酷的电子邮件设计,确保您使用CSS3使用现代结构良好的HTML开发电子邮件模板。如果这是不可能的,那么您可以使模板更简单(并且仍然满足您想要的布局和外观)是实现最广泛兼容性的最佳方法。
为了正确呈现结构化电子邮件,移动应用程序和浏览器(iphone、ipad以及所有Android手机和平板电脑)将需要基于CSS3或灵活的CSS框架的HTML模板。
警告:
Microsoft Outlook for Windows/Office 365有它自己的问题,可能会导致严重的头痛(特别是如果你在电子邮件模板中使用任何
43岁的评论