2

我正在使用联系表 7（wordpress、联系表）作为产品的订单页面。但我有兴趣将 HTML-Mail-template 的样式设置为与图片相同的 3 列样式。有什么简单的方法可以做到这一点吗？在此处输入图像描述

4

3 回答 3

4

我认为前两个答案误解了这个问题。Johny 询问他如何编辑通过联系表格 7 发送给他自己或填写表格的人的 html 电子邮件。

为此，您需要选择“使用 HTML 内容类型”选项，以便在电子邮件中使用 html。这是 CF7 的“邮件”部分。

那么设置 html 电子邮件模板样式的最简单方法是使用表格。

  1. 首先从一个带有 XHTML 文档类型的空白 html 模板开始：

    StackOverflow 电子邮件模板

  2. 然后你可以添加任何你需要的 html 和信息，让它看起来像你想要的那样：

例如，从没有边距或填充开始可能更容易，因此您可以在 body 标签中添加一些样式：

<body style="margin: 0; padding: 0;">
  1. 然后，您需要将所有样式内联添加到表格中，因为您的电子邮件没有发送样式表。您还可以像使用普通 html 一样在该部分中创建一个内联样式部分。

所以我会为你的例子做这个：

<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;" >
  1. 完成所有设置后，您需要将单元格添加到表格中。

例如，您的第一行和第二行可能是这样的：

<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>

每个将是一个新行，每个部分将是一个新单元格。然后继续填充和构建您的表格以显示您想要的方式。

您可以根据需要将内联样式添加到 or 元素中，也可以如前所述在区域中添加内联样式。

这是我需要为使用联系表格 7 插件的网站做的事情。我发现这些教程非常有帮助。

  1. 啧啧 1

  2. 啧啧2

希望我自己没有误解这个问题，它有点模棱两可，但它是我找到的最接近我正在寻找的问题。

于 2017-06-20T17:25:34.263 回答
-1

有两种方法

(1) 覆盖 Contact Form-7 本身的 CSS。这可以通过 .wpcf7-[inner class] 然后你的 CSS 代码来完成。

[简单的方法]

(2) 您可以使用此插件https://wordpress.org/plugins/contact-form-7-style/来设置联系表格 7 的样式。它有多种选择。虽然它并不完美，但肯定是一个解决方案。希望这可以帮助！

于 2014-02-25T17:04:58.050 回答
-1

是的，您可以这样做，您需要在现有的主题文件中添加一些 css，因为不建议修改插件文件，因为我可以看到您已经使用了文本框，您可以这样做

样式

.wpcf7-text { 宽度:150px !important; }

.wpcf7-text 是表单设置中联系表单7中的文本框类

你的名字- [text- text-20]

你的地址- [text- text-30]

于 2012-11-24T10:03:39.147 回答