如何自定义 Cognito 验证电子邮件中的 link？

Question

当用户通过我的应用程序注册时，Cognito 会发送一封包含验证的电子邮件 link。

AWS Cognito 提供了一个模板 ({## text ##})，可以转换为某种形式的 link，例如<a href='link-to-confirm'> text </a>.

如何向此 a 标签添加 CSS 样式？

Answer 1

AWS Cognito 有一组 editable 消息模板，其中还包括验证消息模板。

自定义验证消息：

导航到 AWS 控制台中的 AWS Cognito 服务，然后单击您的用户池名称。

向下滚动并select 消息选项卡。

在 消息模板、select 验证消息 条目下 table 并单击编辑.

无论您的验证类型是什么，无论是 link 还是代码，添加任何您喜欢的内联 CSS 样式并按 保存更改 。请注意，很遗憾，您无法修改 AWS Cognito 本身生成的 a 标签。

代码验证类型示例：

Your verification code is <span style="color: red;">{####}</span>.

电子邮件验证类型示例：

Please click the link below to verify your email address.<span style="color: red;">{##Verify Email##}</span>

这应该会保存您自定义的 Cognito 确认 code/link。

Answer 2

您可以在 <head> 部分中使用 <style> 标签。例如，

<head>
  <style>
    a {color : orange !important;}
    a:hover {color : red !important;}
  </style>
</head>
<body>
  <a href="www.google.com">Test link</a>
  {##Cognito link##} 
</body>

我自己试过了，至少在 Gmail 中是可行的。悬停的时候也会变红，就是不能截图。

最后的免责声明，据我所知，电子邮件样式最好内联完成（如 <a style="...">...</a>）。因此，根据电子邮件客户端的不同，可能不支持这种方法。不过，至少，我已经在 Gmail 中测试过它。

如果您确实需要使用内联 CSS，您仍然可以通过使用 Cognito 触发器完全自定义电子邮件来调用 Lambda 函数来实现。有关示例，请参见此 article。我没有跳到这个解决方案，因为它主要用于需要动态电子邮件内容的时候。

如何自定义 Cognito 验证电子邮件中的 link？

How can I customise the link in a Cognito verification email?

html

email

amazon-web-services

amazon-cognito