2012-11-12 56 views
0

我使用联系表格7(wordpress,联系表)作为订购页面 产品。但我对图片样式相同的3列样式的HTML-Mail-template感兴趣。有没有简单的方法来做到这一点? enter image description here联系表格7(wordpress)风格的hml邮件模板

+0

编辑插件的'style.css',但不建议这样做。 –

+0

我想你必须检查插件的HTML消息格式,看看你是否可以修改它。我不认为这会是一件容易的事,但不知道这个插件。 –

回答

0

是的,你可以做到这一点,你需要一些CSS添加到您现有的主题文件,因为不推荐的插件文件的修改,因为我可以看到你使用的文本框,你可以做这样的事情

css样式

.wpcf7文本{宽度:150像素重要; }

.wpcf7文本是文本框类接触形式7 在形式设置

你的名字 - [文本的文本-20]

您addres- [文本的文本-30]

0

有两种方法

(1)过骑CSS触点形式-7 ITSE的如果。这可以通过.wpcf7- [内部类]然后你的CSS代码完成。

[容易的方法]

(2)可以使用该插件https://wordpress.org/plugins/contact-form-7-style/到风格接触形式-7。它有多种选择。这虽然并不完美,但肯定是一个解决方案。 希望这有助于!

0

我想以前的两个答案误解了这个问题。 Johny问他如何编辑通过联系表7发送给自己或完成表单的人发送的html电子邮件。

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

然后,最简单的HTML电子邮件模板样式是使用表格。

  1. 首先开始与一个XHTML文档类型空白HTML模板:

    StackOverflow的电子邮件模板

  2. 然后你就可以添加你需要的任何HTML和信息,让寻找它的方式,你希望它:

例如,它可能是更容易启动,无保证金或填充,所以你添加一些风格body标签:

<body style="margin: 0; padding: 0;"> 
  • 然后你需要添加你的所有样式内嵌在表中有与您的电子邮件发送任何样式表。您也可以像使用普通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;" > 
    
  • 一旦被设定所有你需要的细胞添加到您的表。
  • 举个例子你的第一排和第二排可以是这样的:

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

    每个都将是一个新的行,每节将是一个新的细胞。然后,只需保持填充和构建您的表格以显示您想要的方式。

    您可以根据需要将内联样式添加到元素中,也可以像前面提到的那样在区域中添加内联样式。

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

    1. Tut 1

    2. Tut 2

    希望我没有误解的问题我自己,这是一个有点暧昧,但它是最接近的一个,我发现我一直在寻找。