我们可以使用Bootstrap在Spring MVC项目中设计Apache FreeMarker电子邮件模板吗?

时间:2017-07-25 18:12:13

标签: spring-mvc twitter-bootstrap-3 html-email freemarker

我想在Spring MVC项目中设计我的电子邮件模板,我正在使用Apache FreeMarker模板发送电子邮件内容。

newUserRegRequest.ftl (资源文件夹中的电子邮件模板文件)

<html><head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"/>
</head>
<body>
    <h2>Hi,</h2>
    <h3>New Registration for BidManager Development</h3>
    <div>
        First Name : ${bmUserModel.firstName}
        Last Name  : ${bmUserModel.lastName}
        Country    : ${bmUserModel.country}
    </div>
    <pre><a class="btn btn-default" href="https://stackoverflow.com/">Accept</a>   <a class="btn btn-default" href="https://stackoverflow.com/">Reject</a></pre>
</body></html>

我使用过Bootstrap按钮类但不知道应该在哪里保留它的CSS库(它是一个Eclipse动态Web项目)。以下是我配置电子邮件服务器的方式。

弹簧servlet.xml中

<!-- Start: Email Configuration -->
<beans:bean id="bmRegMailSender" class="org.springframework.mail.javamail.JavaMailSenderImpl">
    <beans:property name="host" value="${bm.smtp.hostName}"></beans:property>
    <beans:property name="port" value="${bm.smtp.port}"></beans:property>
    <beans:property name="username" value="${bm.smtp.username}"></beans:property>
    <beans:property name="password" value="${bm.smtp.password}"></beans:property>
    <beans:property name="defaultEncoding" value="${bm.defaultEncoding}"></beans:property>
    <beans:property name="javaMailProperties">
        <beans:props>
            <beans:prop key="mail.transport.protocol">${bm.transport.protocolName}</beans:prop>
            <beans:prop key="mail.smtp.auth">${bm.smtp.authorization}</beans:prop>
            <beans:prop key="mail.smtp.starttls.enable">${bm.smtp.tls}</beans:prop>
            <beans:prop key="mail.debug">${bm.mail.debug}</beans:prop>
            <!-- <beans:prop key="mail.smtp.ssl.enable">${bm.smtp.ssl}</beans:prop> -->
        </beans:props>
    </beans:property>
</beans:bean>
<beans:bean id="bmFreeMarkerConfig" class="org.springframework.ui.freemarker.FreeMarkerConfigurationFactoryBean">
    <beans:property name="templateLoaderPath" value="classpath:/templates/"></beans:property>
</beans:bean>
<!-- End: Email Configuration -->

当我发送电子邮件时,这就是我在雅虎邮箱中的样子:

enter image description here

我想表现如下:

enter image description here

如果有一些替代方法来设计FreeMarker模板(除了内联样式),答案是可以接受的。请忽略按钮文字。

1 个答案:

答案 0 :(得分:2)

电子邮件是一个类似的外观,但不同于html5的野兽。有一些电子邮件客户端支持某些html5和一些css3。

这取决于您希望您的电子邮件在不同客户端上看起来有多好。大多数流行的电子邮件客户端将在标头中使用<style>块。您已经声明您不希望使用内联样式,这意味着您的电子邮件在Outlook中看起来不太好。没有内联样式的漂亮按钮将成为一个巨大的挑战,因为你已经注意到雅虎的邮件。

我感谢您的热情,但我不认为您完全掌握了电子邮件开发的复杂性。

祝你好运。