Autoresponder stripping tags from my HTML

Solarian

Registered
Feb 28, 2022
3
0
1
New York, NY
cPanel Access Level
Reseller Owner
I'm trying to set up an autoresponder with HTML formatted email.

I used a third-party service (Stripo.email) to create the HTML. The images are hosted on their servers.

I pasted the HTML into the body field for the autoresponder. When I ran a test email, however, the majority of the formatting was lost. Speaking with support for Stripo, they looked at the resultant email and said that the cPanel autoresponder was stripping out tags.

Is there any way to set up an autoresponse email that will preserve the HTML as entered?

Screenshots attached. Thanks!

Intended email formatting:
Screen Shot 2022-02-28 at 12.11.59 PM.png

HTML entered into cPanel:

Screen Shot 2022-02-28 at 12.12.16 PM.png


Email as it is sent from cPanel autoresponder:
Screen Shot 2022-02-28 at 12.12.26 PM.png
 
Last edited by a moderator:

cPRex

Jurassic Moderator
Staff member
Oct 19, 2014
12,499
1,971
363
cPanel Access Level
Root Administrator
Hey there! I wasn't able to reproduce this on my end, although my HTML test was much simpler than your page. Here is the code I used in the autoresponder field:

Code:
 <!DOCTYPE html>
<html>
<head>
<title>Autoresponder HTML Test</title>
</head>

<body>
<p>This is some text</p>
<p>This is some more text</p>
<p>This is an image:</p>

 <img src="https://full-link-to-a-real-image.com" alt="Image text">

</body>
</html>
That did display the paragraphs and image properly on my end.

Is it possible that particular mail client isn't handling the HTML email well? There can also be clients-die settings to keep remote links from loading within the mail itself.
 

Solarian

Registered
Feb 28, 2022
3
0
1
New York, NY
cPanel Access Level
Reseller Owner
Hey there! I wasn't able to reproduce this on my end, although my HTML test was much simpler than your page. Here is the code I used in the autoresponder field:

Code:
 <!DOCTYPE html>
<html>
<head>
<title>Autoresponder HTML Test</title>
</head>

<body>
<p>This is some text</p>
<p>This is some more text</p>
<p>This is an image:</p>

<img src="https://full-link-to-a-real-image.com" alt="Image text">

</body>
</html>
That did display the paragraphs and image properly on my end.

Is it possible that particular mail client isn't handling the HTML email well? There can also be clients-die settings to keep remote links from loading within the mail itself.

Thanks! I think it's the complexity of code, maybe?

I've tried sending the same HTML directly from Gmail, and it displayed properly, so I've eliminated my mail client as the culprit. Here's the exact code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta http-equiv="Content-Style-Type" content="text/css">
  <title></title>
  <meta name="Generator" content="Cocoa HTML Writer">
  <meta name="CocoaVersion" content="2022.3">
  <style type="text/css">
    p.p1 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; font: 12.0px Arial; color: #000000; -webkit-text-stroke: #000000; min-height: 14.0px}
    p.p2 {margin: 0.0px 0.0px 0.0px 0.0px; line-height: 24.0px; font: 16.0px Arial; color: #262626; -webkit-text-stroke: #262626}
    p.p4 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; line-height: 21.0px; font: 14.0px Arial; color: #262626; -webkit-text-stroke: #262626}
    p.p5 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; line-height: 22.0px; font: 18.0px Arial; color: #ffffff; -webkit-text-stroke: #ffffff; background-color: #ee3312}
    p.p6 {margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Arial; color: #000000; -webkit-text-stroke: #000000; min-height: 14.0px}
    p.p7 {margin: 0.0px 0.0px 0.0px 0.0px; text-align: center; font: 14.0px Arial; color: #ffffff; -webkit-text-stroke: #ffffff; min-height: 16.0px}
    p.p8 {margin: 0.0px 0.0px 0.0px 0.0px; line-height: 18.0px; font: 12.0px Arial; color: #ee3312; -webkit-text-stroke: #ee3312}
    span.s1 {font-kerning: none}
    span.s2 {font-kerning: none; background-color: #f4f4f4}
    span.s3 {text-decoration: underline ; font-kerning: none; color: #ee3312; -webkit-text-stroke: 0px #ee3312}
    span.s4 {font-kerning: none; color: #535353; background-color: #f4f4f4; -webkit-text-stroke: 0px #535353}
    span.s5 {font-kerning: none; color: #535353; -webkit-text-stroke: 0px #535353}
    table.t1 {width: 785.0px; border-collapse: collapse}
    table.t2 {border-collapse: collapse; table-layout: fixed}
    table.t3 {background-color: #ffffff; margin: 0.0px 92.5px 0.0px 92.5px; border-collapse: collapse}
    table.t4 {width: 560.0px; border-collapse: collapse}
    table.t5 {width: 580.0px; border-collapse: collapse}
    table.t6 {border-collapse: collapse}
    table.t7 {width: 174.0px; border-collapse: collapse}
    table.t8 {width: 173.0px; border-collapse: collapse}
    table.t9 {width: 270.0px; border-collapse: collapse}
    td.td1 {width: 785.0px}
    td.td2 {width: 560.0px; padding: 20.0px 20.0px 0.0px 20.0px}
    td.td3 {width: 560.0px}
    td.td4 {width: 580.0px; padding: 10.0px 10.0px 10.0px 10.0px}
    td.td5 {width: 580.0px}
    td.td6 {width: 560.0px; padding: 20.0px 20.0px 20.0px 20.0px}
    td.td7 {width: 174.0px}
    td.td8 {width: 174.0px; padding: 15.0px 0.0px 0.0px 0.0px}
    td.td9 {width: 174.0px; padding: 10.0px 0.0px 10.0px 0.0px}
    td.td10 {width: 20.0px}
    td.td11 {width: 173.0px}
    td.td12 {width: 173.0px; padding: 15.0px 0.0px 0.0px 0.0px}
    td.td13 {width: 173.0px; padding: 10.0px 0.0px 10.0px 0.0px}
    td.td14 {width: 270.0px}
  </style>
</head>
<body>
<table width="785.0" cellspacing="0" cellpadding="0" class="t1">
  <tbody>
    <tr>
      <td valign="top" class="td1">
        <table cellspacing="0" cellpadding="0" class="t2">
          <tbody>
            <tr>
              <td valign="middle" class="td1">
                <table cellspacing="0" cellpadding="0" class="t3">
                  <tbody>
                    <tr>
                      <td valign="middle" class="td2">
                        <table width="560.0" cellspacing="0" cellpadding="0" class="t4">
                          <tbody>
                            <tr>
                              <td valign="top" class="td3">
                                <table width="560.0" cellspacing="0" cellpadding="0" class="t4">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td3">
                                        <p class="p1"><span class="s1"></span><br></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>
        <table cellspacing="0" cellpadding="0" class="t2">
          <tbody>
            <tr>
              <td valign="middle" class="td1">
                <table cellspacing="0" cellpadding="0" class="t3">
                  <tbody>
                    <tr>
                      <td valign="middle" class="td4">
                        <table width="580.0" cellspacing="0" cellpadding="0" class="t5">
                          <tbody>
                            <tr>
                              <td valign="top" class="td5">
                                <table width="580.0" cellspacing="0" cellpadding="0" class="t5">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td5">
                                        <p class="p2"><span class="s2">Thank you for supporting Equality Texas!</span><span class="s1"><br>
<br>
</span><span class="s2">We're proud to be able to contribute games to help secure full equality for LGBTQ+ Texans.</span><span class="s1"><br>
<br>
</span><span class="s2">Your game bundle includes the core book for our spy RPG Top Secret NWO, and the first two mission modules, "The White Queen" &amp; "Rendezvous Oasis."</span><span class="s1"><br>
<br>
</span><span class="s2">To get each file, use the links below. Each link will add the product to your cart for $0.00, and you can download for free.</span><span class="s1"><br>
<br>
</span><span class="s2">If you enjoy the games, have questions, or just want to say hi, please visit us on Twitter at <a href="https://twitter.com/Solariangames"><span class="s3">@SolarianGames</span></a> or email <a href="mailto:[email protected]"><span class="s3">[email protected]</span></a></span><span class="s1"><br>
<br>
</span></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                    <tr>
                      <td valign="middle" class="td6">
                        <table cellspacing="0" cellpadding="0" class="t6">
                          <tbody>
                            <tr>
                              <td valign="middle" class="td7">
                                <table width="174.0" cellspacing="0" cellpadding="0" class="t7">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td7">
                                        <p class="p1"><span class="s1"></span><br></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td8">
                                        <h3 style="margin: 0.0px 0.0px 0.0px 0.0px; line-height: 24.0px; font: 20.0px Arial; color: #262626; -webkit-text-stroke: #262626"><span class="s2">Top Secret NWO</span></h3>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td9">
                                        <p class="p4"><span class="s2">Core rules for the espionage RPG</span></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td7">
                                        <p class="p5"><span class="s1">FREE DOWNLOAD</span></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                              <td valign="middle" class="td10">
                                <p class="p6"><span class="s1"></span><br></p>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                        <table cellspacing="0" cellpadding="0" class="t6">
                          <tbody>
                            <tr>
                              <td valign="middle" class="td11">
                                <table width="173.0" cellspacing="0" cellpadding="0" class="t8">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td11">
                                        <p class="p1"><span class="s1"></span><br></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td12">
                                        <h3 style="margin: 0.0px 0.0px 0.0px 0.0px; line-height: 24.0px; font: 20.0px Arial; color: #262626; -webkit-text-stroke: #262626"><span class="s2">The White Queen</span></h3>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td13">
                                        <p class="p4"><span class="s2">Rescue the kidnapped scientist in Latvia</span></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td11">
                                        <p class="p5"><span class="s1">FREE DOWNLOAD</span></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                        <table cellspacing="0" cellpadding="0" class="t6">
                          <tbody>
                            <tr>
                              <td valign="middle" class="td11">
                                <table width="173.0" cellspacing="0" cellpadding="0" class="t8">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td11">
                                        <p class="p1"><span class="s1"></span><br></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td12">
                                        <h3 style="margin: 0.0px 0.0px 0.0px 0.0px; line-height: 24.0px; font: 20.0px Arial; color: #262626; -webkit-text-stroke: #262626"><span class="s2">Rendezvous Oasis</span></h3>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td13">
                                        <p class="p4"><span class="s2">A covert mission in the Sahara desert</span></p>
                                      </td>
                                    </tr>
                                    <tr>
                                      <td valign="middle" class="td11">
                                        <p class="p5"><span class="s1">FREE DOWNLOAD</span></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>
        <table cellspacing="0" cellpadding="0" class="t2">
          <tbody>
            <tr>
              <td valign="middle" class="td1">
                <table cellspacing="0" cellpadding="0" class="t3">
                  <tbody>
                    <tr>
                      <td valign="middle" class="td6">
                        <table cellspacing="0" cellpadding="0" class="t6">
                          <tbody>
                            <tr>
                              <td valign="middle" class="td14">
                                <table width="270.0" cellspacing="0" cellpadding="0" class="t9">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td14">
                                        <p class="p7"><span class="s1"><a href="mailto:[email protected]"></a></span><br></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                        <table cellspacing="0" cellpadding="0" class="t6">
                          <tbody>
                            <tr>
                              <td valign="middle" class="td14">
                                <table width="270.0" cellspacing="0" cellpadding="0" class="t9">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td14">
                                        <p class="p1"><span class="s1"></span><br></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                    <tr>
                      <td valign="middle" class="td4">
                        <table width="580.0" cellspacing="0" cellpadding="0" class="t5">
                          <tbody>
                            <tr>
                              <td valign="top" class="td5">
                                <table width="580.0" cellspacing="0" cellpadding="0" class="t5">
                                  <tbody>
                                    <tr>
                                      <td valign="middle" class="td5">
                                        <p class="p8"><span class="s4">Text links to your free downloads, in case your email client does not display the image links above:</span><span class="s5"><br>
<br>
</span><span class="s4">Top Secret NWO <a href="https://www.drivethrurpg.com/browse.php?discount=911de22a02"><span class="s3">https://www.drivethrurpg.com/browse.php?discount=911de22a02</span></a></span><span class="s5"><br>
</span><span class="s4">The White Queen <a href="https://www.drivethrurpg.com/browse.php?discount=91213b25e1"><span class="s3">https://www.drivethrurpg.com/browse.php?discount=91213b25e1</span></a></span><span class="s5"><br>
</span><span class="s4">Rendezvous Oasis <a href="https://www.drivethrurpg.com/browse.php?discount=91232b5c46"><span class="s3">https://www.drivethrurpg.com/browse.php?discount=91232b5c46</span></a></span></p>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>
</body>
</html>
 

cPRex

Jurassic Moderator
Staff member
Oct 19, 2014
12,499
1,971
363
cPanel Access Level
Root Administrator
Thanks for that. I saved the entire code to a local file called test.html and it still didn't display the formatting when opened in my local browser (Firefox) so it seems like there may be something else happening as well as it's not just the autoresponder that is affected.

For example, in your code I see the text starts in the <p class="p2"> area but I'm not seeing where the top "solarian" logo would be loaded from as I don't see any image code or any links until the "please visit us on Twitter" section.
 

Solarian

Registered
Feb 28, 2022
3
0
1
New York, NY
cPanel Access Level
Reseller Owner
Thanks for that. I saved the entire code to a local file called test.html and it still didn't display the formatting when opened in my local browser (Firefox) so it seems like there may be something else happening as well as it's not just the autoresponder that is affected.

For example, in your code I see the text starts in the <p class="p2"> area but I'm not seeing where the top "solarian" logo would be loaded from as I don't see any image code or any links until the "please visit us on Twitter" section.

Well spotted! This code was auto-generated, and I didn't think to dig through it myself to look for things like that. I'm going to see what I can do with the code itself and hopefully that solves the problem.