联系表7（wordpress）样式的hml邮件模板 [英] contact form 7 (wordpress) style the hml mail template
问题描述
我正在使用联系表格7（wordpress，联系表格）作为产品的订购页面
。但是我有兴趣以与图片相同的3列样式
来设置HTML-Mail-template的样式。有什么简单的方法吗？
I´m using contact form 7 (wordpress, contact form) as a order page for products. But I´m interested in styling the HTML-Mail-template in the same 3-column style as the picture. Is there any easy way to do that?
推荐答案
我认为前两个答案误解了这个问题。约翰尼（Johny）问他如何编辑通过联系表格7发送给自己或填写表格的人的html电子邮件。
I think the two previous answers misunderstood the question. Johny is asking how he can edit the html email that gets sent out by contact form 7 either to himself or the person who completes the form.
为此，您需要选择使用HTML内容类型选项，以便在电子邮件中使用html。这是CF7的邮件部分。
To do this you need to select the option of "Use HTML content type" in order to use html in the email. This is on the "mail" section of CF7.
然后，最简单的html电子邮件模板样式设置方法是使用表格。
Then the easiest way to style the html email template is using a table.
-
首先从具有XHTML文档类型的空白html模板开始：
First start with a blank html template with a XHTML doctype:
StackOverflow电子邮件模板
StackOverflow Email Template
然后，您可以添加所需的任何html和信息，以使其看起来像您想要的样子：
Then you can add any html and information you need to, to get it looking the way you want it:
例如，开始时没有边距或填充可能会更容易，因此您可以在body标签上添加一些样式：
For instance it is probably easier to start with no margin or padding so you add some style to the body tag:
<body style="margin: 0; padding: 0;">
- 然后您需要内联添加所有样式在表格中，因为您的电子邮件没有发送样式表。您也可以像普通html一样在该部分中创建一个内联样式部分。
所以我将为您的示例执行此操作：
so I would do this for your example:
<table align="center" border="0" cellpadding="2" cellspacing="0" width="100%" bgcolor="#ffffff" style="border-collapse: collapse; font-family: Arial,sans-serif; font-size:1em;" >
- 设置完毕后，您需要添加
例如，您的第一行和第二行可能是这样的：
As an example your first and second row could be something like this:
<tbody>
<tr>
<td colspan="6">To: [your-name]</td>
</tr>
<tr>
<td>Falt Utan Flask:</td>
<td>[Input-One] Back</td>
<td>Falt Utan Flask:</td>
<td>[Input-Two] Back</td>
<td>Set Datum:</td>
<td>[Date-324]</td>
</tr>
</tbody>
每个将是一个新行，每个节将是一个新单元格。然后只需继续填充并构建表以显示所需的样式即可。
Each will be a new row, and each section will be a new cell. Then just keep populating and building out your table to display the way you want it.
您可以根据需要在或元素中添加内联样式，也可以添加
You can add inline style into the or elements as you need it or you can add the inline style in the area as mentioned before.
这是我需要使用联系表单7插件的网站所需要执行的操作。我发现这些对教程非常有帮助。
This is what i needed to do for a website using the contact form 7 plugin. I found these to tutorials very helpful.
希望我自己没有误解这个问题，虽然有点模棱两可，但这是我发现的最接近我的问题正在寻找。
Hopefully I have not misunderstood the question myself, it is a bit ambiguous, but it was the closest one I found to what I was looking for.
这篇关于联系表7（wordpress）样式的hml邮件模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
