2012-11-12 82 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

    希望我沒有誤解的問題我自己,這是一個有點曖昧,但它是最接近的一個,我發現我一直在尋找。