|
Pranu Bhargava
|
June 3, 2013 at 2:56 pm
Been trying to create HTML email in the general settings tab for payment confirmation – but seems like wordpress’ wpautop function takes over and all the HTML is quoted with <p> tags and also br tags after every line.
Any suggestions on how we can design custom html emails?
Event Espresso version3.1.32.2.P
WordPress versionWP 3.5.1
|
|
Josh
|
June 4, 2013 at 7:15 pm
Hi Pranu,
Can you post some sample HTML email content so we can look into this?
|
|
Pranu Bhargava
|
June 5, 2013 at 6:54 am
Hi Josh,
Not a problem. I am posting this HTML into the Email Setting content block using the Text option, not Visual. It is from a basic MailChimp HTML template:
<!– // Begin Template Body \\ –>
<table border=”0″ cellpadding=”0″ cellspacing=”0″ width=”600″ id=”templateBody”>
<tr>
<td valign=”top” class=”bodyContent”>
<!– // Begin Module: Standard Content \\ –>
<table border=”0″ cellpadding=”20″ cellspacing=”0″ width=”100%”>
<tr>
<td valign=”top”>
<div mc:edit=”std_content00″>
<h1 class=”h1″ style=”text-align:center;”>You Have Been Registered!</h1>
<p><strong>[fname]</strong>,</p>
<p>Thank you for registering for [event].</p>
<p>Your transaction ID number is [txn_id]</p>
<strong>We are excited here at CU</strong> to get you going on the path to your certificate!
<p>Thank You.</p>
</div>
</td>
</tr>
</table>
<!– // End Module: Standard Content \\ –>
This is the result after save: http://colorado.allcampus.com/espresso-email/after-save.jpg
|
|
Josh
|
June 5, 2013 at 9:24 am
Hi Pranu,
I tried the code and I did see an issue right after I took the markup you posted above, fixed the double quotes that got converted by the forum software and posted it into the Payment confirmation email editor and saved. However, I switched to visual mode, then back to text mode and saved and while there were a few p tags added, they were only there where a line break was needed.
The one thing that did happen was the html comment lines got a bit messed up from when I toggled back and forth from Text mode to Visual mode. So I removed those.
Here’s the markup I pasted in:
<table border="0" cellpadding="0" cellspacing="0" width="600" id="templateBody">
<tr>
<td valign="top" class="bodyContent">
<table border="0" cellpadding="20" cellspacing="0" width="100%">
<tr>
<td valign="top">
<div mc:edit="std_content00">
<h1 class="h1" style="text-align:center;">You Have Been Registered!</h1>
<p><strong>[fname]</strong>,</p>
<p>Thank you for registering for [event].</p>
<p>Your transaction ID number is [txn_id]</p>
<strong>We are excited here at CU</strong> to get you going on the path to your certificate!
<p>Thank You.</p>
</div>
</td>
</tr>
</table>
Here’s the markup I ended up with:
<table id="templateBody" width="600" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="bodyContent" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="20">
<tbody>
<tr>
<td valign="top">
<div>
<h1 class="h1" style="text-align: center;">You Have Been Registered!</h1>
<p><strong>[fname]</strong>,</p>
<p>Thank you for registering for [event].</p>
<p>Your transaction ID number is [txn_id]</p>
<p><strong>We are excited here at CU</strong> to get you going on the path to your certificate!</p>
<p>Thank You.</p>
</div>
</td>
</tr>
</tbody>
</table>
One thing that may be causing the extra tags to get added is if there are any theme or plugin functions that are adding their own formatting functions. I’m running the twentythirteen theme with a minimal set of plugins. So if the issue persists you might try temporarily switching to the default theme and deactivating other plugins and this may help.
|
|
Pranu Bhargava
|
June 5, 2013 at 10:14 am
Posts now showing up
|
|
Pranu Bhargava
|
June 5, 2013 at 10:16 am
I submitted a response twice and it didn’t show up. I submitted the response about and that showed up, so I’m not sure if my posts are being posted. Will try in pieces.
|
|
Pranu Bhargava
|
June 5, 2013 at 10:16 am
This seemed to help a bit. I switched over to the TwentyEleven theme and turned off ALL plugins except for Event Espresso. This email code has been parsed through CSS in-liner tool and tested with different email clients. I pasted the code and clicked on visual to check then saved. That seemed to not add any <br> tags and <p> tags BUT it stripped out the <p> tags I needed.
Pasted Code:
<table id="backgroundTable" style="margin: 0; padding: 0; background-color: #fafafa; height: 100%; width: 100%;" width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="border-collapse: collapse;" align="center" valign="top">
<table id="templatePreheader" style="background-color: #fafafa;" width="600" border="0" cellspacing="0" cellpadding="10">
<tbody>
<tr>
<td class="preheaderContent" style="border-collapse: collapse;" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="10">
<tbody>
<tr>
<td style="border-collapse: collapse;" valign="top">
<div style="color: #505050; font-family: Arial; font-size: 10px; line-height: 100%; text-align: left;">Thank you for signing up for the Sustainable Practices Program Online at the University of Colorado.</div></td>
<td style="border-collapse: collapse;" valign="top" width="190">
<div style="color: #505050; font-family: Arial; font-size: 10px; line-height: 100%; text-align: left;">Is this email not displaying correctly? Make sure to download images.</div></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table id="templateContainer" style="border: 1px solid #DDDDDD; background-color: #ffffff;" width="600" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="border-collapse: collapse;" align="center" valign="top">
<table id="templateHeader" style="background-color: #ffffff; border-bottom: 0;" width="600" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="headerContent" style="border-collapse: collapse; color: #202020; font-family: Arial; font-size: 34px; font-weight: bold; line-height: 100%; padding: 0; text-align: center; vertical-align: middle;"><img id="headerImage campaign-icon" style="max-width: 600px; border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none;" alt="" src="http://colorado.allcampus.com/wp-content/themes/cu/images/email/gen-header.jpg" /></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="border-collapse: collapse;" align="center" valign="top">
<table id="templateBody" width="600" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="bodyContent" style="border-collapse: collapse; background-color: #ffffff;" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="20">
<tbody>
<tr>
<td style="border-collapse: collapse;" valign="top">
<div style="color: #505050; font-family: Arial; font-size: 14px; line-height: 150%; text-align: left;">
<h1 class="h1" style="text-align: center; color: #202020; display: block; font-family: Arial; font-size: 34px; font-weight: bold; line-height: 100%; margin-top: 0; margin-right: 0; margin-bottom: 10px; margin-left: 0;">You Have Been Registered!</h1>
<strong>[fname]</strong>,
<p>Thank you for registering for [event].</p>
<p>Your transaction ID number is [txn_id]</p>
<p><strong>We are excited here at CU</strong> to get you going on the path to your certificate!</p>
<p>Thank You.</p>
</div></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="border-collapse: collapse;" align="center" valign="top">
<table id="templateFooter" style="background-color: #ffffff; border-top: 0;" width="600" border="0" cellspacing="0" cellpadding="10">
<tbody>
<tr>
<td class="footerContent" style="border-collapse: collapse;" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="10">
<tbody>
<tr>
<td id="social" style="border-collapse: collapse; background-color: #fafafa; border: 0;" colspan="2" valign="middle">
<div style="color: #707070; font-family: Arial; font-size: 12px; line-height: 125%; text-align: center;">Follow CU on <a style="color: #336699; font-weight: normal; text-decoration: underline;" href="*|TWITTER:PROFILEURL|*"> Twitter</a></div></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
|
|
Pranu Bhargava
|
June 5, 2013 at 10:24 am
My responses aren’t being posted. My intended <p> tags get stripped out and the email is broken in my email client. The email has been tested on email clients and should not be broken.
|
|
Josh
|
June 10, 2013 at 8:15 am
Hi Pranu,
I’m not finding this to be the case when I test this on my setup, but you might try an alternate template that doesn’t rely on p tags -or- if you want to try some experimentation, you could remove the autop filter from the /includes/functions/email.php on line 577.
|
![http://colorado.allcampus.com/wp-content/themes/cu/images/email/gen-header.jpg"](http://colorado.allcampus.com/wp-content/themes/cu/images/email/gen-header.jpg"){kind=link}
