英文:
How to apply the CSS style in a Gomail library?
问题
我成功地使用Gomail库向用户发送电子邮件。我使用了一个单独的模板来处理HTML文件，并使用html2text库将HTML代码转换为文本，但问题是只显示文本，CSS样式没有应用。
如何在发送电子邮件时同时应用CSS样式？
main.go
func Verify(toEmail, accountName string) {
mail := gomail.NewMessage()
myEmail := middleware.LoadEnvVariable("APP_EMAIL")
myPassword := middleware.LoadEnvVariable("APP_PASSWORD")
body := new(bytes.Buffer)
t, err := template.ParseFiles("cmd/template.html")
if err != nil {
log.Fatal(err)
}
getAccountInfo := AccountInfo{
GetAccountName: accountName,
}
if err := t.Execute(body, getAccountInfo); err != nil {
log.Fatal("Could not execute the template", err)
}
mail.SetHeader("From", myEmail)
mail.SetHeader("To", toEmail)
mail.SetHeader("Reply-To", myEmail)
mail.SetHeader("Subject", "Confirm your email address")
mail.SetBody("text/html", html2text.HTML2Text(body.String()))
a := gomail.NewDialer("smtp.gmail.com", 587, myEmail, myPassword)
if err := a.DialAndSend(mail); err != nil {
log.Fatal(err)
}
}
template.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.button-style{
background-color:#008CBA;
border-color:#008CBA;
border-radius: 4px;
color:white;
height: 50px;
width: 300px;
}
</style>
</head>
<body>
<center><h1>We're glad you're here, {{.GetAccountName}}</h1></center>
<center>We just want to confirm it's you.<br><br></center>
<center>
<button class="button-style">
Click to confirm your email address
</button>
<center>
<center><br>If you didn't create a proctl account, just delete this email.</center>
</body>
</html>
英文:
I am successfully sending the email to the user using the Gomail library. I have used a separate template for the HTML file and converted the HTML code into text using the html2text library for it but the problem is that it is showing the text only but the CSS style is not applied to it.
How to apply the CSS also while sending an email?
main.go
func Verify(toEmail, accountName string) {
mail := gomail.NewMessage()
myEmail := middleware.LoadEnvVariable("APP_EMAIL")
myPassword := middleware.LoadEnvVariable("APP_PASSWORD")
body := new(bytes.Buffer)
t, err := template.ParseFiles("cmd/template.html")
if err != nil {
log.Fatal(err)
}
getAccountInfo := AccountInfo{
GetAccountName: accountName,
}
if err := t.Execute(body, getAccountInfo); err != nil {
log.Fatal("Could not execute the template", err)
}
mail.SetHeader("From", myEmail)
mail.SetHeader("To", toEmail)
mail.SetHeader("Reply-To", myEmail)
mail.SetHeader("Subject", "Confirm your email address")
mail.SetBody("text/html", html2text.HTML2Text(body.String()))
a := gomail.NewDialer("smtp.gmail.com", 587, myEmail, myPassword)
if err := a.DialAndSend(mail); err != nil {
log.Fatal(err)
}
}
template.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.button-style{
background-color:#008CBA;
border-color:#008CBA;
border-radius: 4px;
color:white;
height: 50px;
width: 300px;
}
</style>
</head>
<body>
<center><h1>We're glad you're here, {{.GetAccountName}}</h1></center>
<center>We just want to confirm it's you.<br><br></center>
<center>
<button class="button-style">
Click to confirm your email address
</button>
<center>
<center><br>If you didn't create a proctl account, just delete this email.</center>
</body>
</html>
答案1
得分: 1
根据https://en.wikipedia.org/wiki/HTML_email，<head>标签的支持不太好：
符合RFC 2822的电子邮件软件只需要支持纯文本，而不支持HTML格式。因此，如果收件人的电子邮件客户端不支持HTML格式，发送HTML格式的电子邮件可能会导致问题。在最糟糕的情况下，收件人将看到HTML代码而不是预期的消息。
在那些支持HTML的电子邮件客户端中，有些不会与W3C规范一致地呈现它，而且许多HTML电子邮件也不符合规范，这可能会导致呈现或传递问题。
特别是
<head>标签，用于存放整个HTML文档的CSS样式规则，支持不太好，有时会完全被剥离，导致内联样式声明成为事实上的标准，尽管内联样式声明效率低下，无法充分利用HTML分离样式和内容的能力。
因此，您应该像这样使用内联样式编写电子邮件内容：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<center><h1>我们很高兴您在这里，{{.GetAccountName}}</h1></center>
<center>我们只是想确认这是您本人。<br><br></center>
<center>
<button style="background-color:#008CBA; border-color:#008CBA; border-radius: 4px; color:white; height: 50px; width: 300px;">
点击确认您的电子邮件地址
</button>
<center>
<center><br>如果您没有创建proctl账户，请忽略此电子邮件。</center>
</body>
</html>
英文:
According to https://en.wikipedia.org/wiki/HTML_email, the <head> tag is not well supported:
> Email software that complies with RFC 2822 is only required to support plain text, not HTML formatting. Sending HTML formatted emails can therefore lead to problems if the recipient's email client does not support it. In the worst case, the recipient will see the HTML code instead of the intended message.
>
> Among those email clients that do support HTML, some do not render it consistently with W3C specifications, and many HTML emails are not compliant either, which may cause rendering or delivery problems.
>
> In particular, the <head> tag, which is used to house CSS style rules for an entire HTML document, is not well supported, sometimes stripped entirely, causing in-line style declarations to be the de facto standard, even though in-line style declarations are inefficient and fail to take good advantage of HTML's ability to separate style from content.
So you should write the email content with in-line style like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<center><h1>We're glad you're here, {{.GetAccountName}}</h1></center>
<center>We just want to confirm it's you.<br><br></center>
<center>
<button style="background-color:#008CBA; border-color:#008CBA; border-radius: 4px; color:white; height: 50px; width: 300px;">
Click to confirm your email address
</button>
<center>
<center><br>If you didn't create a proctl account, just delete this email.</center>
</body>
</html>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论