Question

我正在使用rails应用程序中的html.erb文件生成一封电子邮件，供用户确认其电子邮件地址。我正在尝试将link_to行设置为绿色按钮，就像我在其他电子邮件中使用一样。但它显示为纯文本链接。

这是我遇到问题的链接

      <tr style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; box-sizing: border-box; font-size: 14px; margin: 0;">
      <td class="content-block" style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; box-sizing: border-box; font-size: 14px; vertical-align: top; margin: 0; padding: 0 0 20px;" valign="top">
          <%= link_to 'Confirm Email', confirmation_url(@resource, confirmation_token: @token), class: 'btn-sm-mpgreen' %>
      </td>
      </tr>

在电子邮件中看起来像这样

这是我创建的另一封电子邮件中的绿色按钮，我也想在上面使用。

                    <a href="<%= ENV['EXTERNAL_URL'] %>/#/new_match" class="btn-primary" itemprop="url" style="font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; box-sizing: border-box; font-size: 14px; color: #FFF; text-decoration: none; line-height: 2em; font-weight: bold; text-align: center; cursor: pointer; display: inline-block; border-radius: 5px; text-transform: capitalize; background-color: #13904B; margin: 10px 0; border-color: #13904B; border-style: solid; border-width: 10px 20px;">Schedule Match</a>

电子邮件中的内容如下所示

Answer 1

为您的班级添加样式

.btn-sm-mpgreen {
 font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; box-sizing: border-box; 
 font-size: 14px; color: #FFF; text-decoration: none; line-height: 2em;
 font-weight: bold; text-align: center; cursor: pointer; display: inline-block;
 border-radius: 5px; text-transform: capitalize; background-color: #13904B; margin: 10px 0; 
 border-color: #13904B; border-style: solid; border-width: 10px 20px;
}

Answer 2

这是因为您没有为设计电子邮件的html.erb添加样式。写下head之类的内容：

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Rails Email</title>
  <style type="text/css">
  .background { background-color:#555555; height:2px; }
  /* Some of your css code */
  </style>
</head>

在html erb中为电子邮件创建link_to按钮

2 个答案: