Bug: Dynamic Content Hidden Character

thomasjohnausti

07-08-2019

Hello,

I'm having an issue where dynamic content is adding weird hidden characters above and below the variant blocks. There's no way to remove this and it's being included in the send, breaking my emails. I have custom HTML set up in compatibility mode and am not interested in following the email designer code structure.

Screen Shot 2019-08-07 at 10.02.28 pm.png

Any help with this would be greatly appreciated.

Thanks,

Tom

Accepted Solutions (1)

Accepted Solutions (1)

thomasjohnausti

08-08-2019

Thanks for trying to help. These characters are being added by the editor around dynamic content and there's no way of removing them unless I switch to the legacy editor. I might log a support ticket to see if they can have a look.

Cheers,

Tom

Answers (4)

Answers (4)

DimaKudryavtsev

07-08-2019

I just attempted to create this template and I do not see any extra characters anywhere.

The code  is a zero-width no-break space character. (http://www.fileformat.info/info/unicode/char/feff/index.htm)

Adobe should not insert something like that, but if you have designed your template via something like Dreamviewer and then copy-paste template code into Adobe, it might sneak in there accidentally. Adobe will allow you to past Unicode characters into the template, but when the template is saved, they will be converted into their XML representation.

I suggest to install something like notepad++, open new text file and set UTF-8 encoding. Copy your HTML code into this text file and save it. It will convert any Unicode character into "?" or an empty string. Now just delete them and copy the clean code to Adobe.

thomasjohnausti

07-08-2019

It works when you paste the html into the delivery, but once you save it, close the window then reopen, these blank characters are added to the template which can be viewed using inspect element.

thomasjohnausti

07-08-2019

<!DOCTYPE html>

<html lang="en" xmlns="https://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">

<head>

   <meta charset="utf-8">

   <meta name="viewport" content="width=device-width">

   <meta http-equiv="X-UA-Compatible" content="IE=edge">

   <meta name="x-apple-disable-message-reformatting">

   <meta name="format-detection" content="telephone=no,address=no,email=no,date=no,url=no">

   <title>Test</title>

  

   <!-- Web Font : BEGIN -->

   <!--[if mso]>

  <style>

  * {

  font-family: Trebuchet MS, sans-serif !important;

  }

  </style>

  <![endif]-->

   <!--[if !mso]><!-->

   <link href="https://fonts.googleapis.com/css?family=Titillium+Web:300,400,600&display=swap" rel="stylesheet">

   <!--<![endif]-->

   <!-- Web Font : END -->


   <!-- CSS Reset : BEGIN -->

  <style>


  html,

   body {

   margin: 0 !important;

   padding: 0 !important;

   height: 100% !important;

   width: 100% !important;

  }

   * {

   -ms-text-size-adjust: 100%;

   -webkit-text-size-adjust: 100%;

   -webkit-font-smoothing: antialiased;

   -moz-osx-font-smoothing: grayscale;

  }

  div[style*="margin: 16px 0"] {

   margin: 0 !important;

  }

  table,

   td {

   mso-table-lspace: 0pt !important;

   mso-table-rspace: 0pt !important;

  }

  table {

   border-spacing: 0 !important;

   border-collapse: collapse !important;

   table-layout: fixed !important;

   margin: 0 auto !important;

  }

  a {

   text-decoration: none;

   color: #333333;

  }

  img {

   -ms-interpolation-mode: bicubic;

  }

  a[x-apple-data-detectors],

   .unstyle-auto-detected-links a,

   .aBn {

   border-bottom: 0 !important;

   cursor: default !important;

   color: inherit !important;

   text-decoration: none !important;

   font-size: inherit !important;

   font-family: inherit !important;

   font-weight: inherit !important;

   line-height: inherit !important;

  }

  .im {

   color: inherit !important;

  }

  .a6S {

   display: none !important;

   opacity: 0.01 !important;

  }

  img.g-img + div {

   display: none !important;

  }

   @media only screen and (min-device-width: 320px) and (max-device-width: 374px) {

   u ~ div .email-container {

   min-width: 320px !important;

  }

  }

   @media only screen and (min-device-width: 375px) and (max-device-width: 413px) {

   u ~ div .email-container {

   min-width: 375px !important;

  }

  }

   @media only screen and (min-device-width: 414px) {

   u ~ div .email-container {

   min-width: 414px !important;

  }

  }


  </style>

   <!--[if gte mso 9]>

  <xml>

  <o:OfficeDocumentSettings>

  <o:AllowPNG/>

  <o:PixelsPerInch>96</o:PixelsPerInch>

  </o:OfficeDocumentSettings>

  </xml>

  <![endif]-->

   <!-- CSS Reset : END -->


   <!-- Progressive Enhancements : BEGIN -->

  <style>


   @media screen and (max-width: 600px) {

   .email-container,

   .full-width {

   width: 100% !important;

   margin: auto !important;

  }

   .image-mobile {

   width: 100% !important;

   height: auto !important;

  }

   .stack-column,

   .stack-column-center {

   display: block !important;

   width: 100% !important;

   max-width: 100% !important;

   min-width: 100% !important;

   direction: ltr !important;

  }

   .stack-column-center {

   text-align: center !important;

  }

   .center-on-narrow {

   text-align: center !important;

   display: block !important;

   margin-left: auto !important;

   margin-right: auto !important;

   float: none !important;

  }

   table.center-on-narrow {

   display: inline-block !important;

  }

   .hide-content {

   display: none !important;

   max-height: 0 !important;

   mso-hide: all !important;

   overflow: hidden !important;

   visibility: hidden !important;

  }

   .show-content {

   display: block !important;

   max-height: none !important;

   mso-hide: none !important;

   overflow: visible !important;

   visibility: visible !important;

  }

   .collapse-height {

   height: auto !important;

  }

   .px-0 {

   padding-left: 0px !important;

   padding-right: 0px !important;

  }

   .px-10 {

   padding-left: 10px !important;

   padding-right: 10px !important;

  }

   .px-20 {

   padding-left: 20px !important;

   padding-right: 20px !important;

  }

   .px-30 {

   padding-left: 30px !important;

   padding-right: 30px !important;

  }

   .pb-0 {

   padding-bottom: 0px !important;

  }

   .pb-10 {

   padding-bottom: 10px !important;

  }

   .pb-20 {

   padding-bottom: 20px !important;

  }

   .pb-30 {

   padding-bottom: 30px !important;

  }

   .pt-0 {

   padding-top: 0px !important;

  }

   .pt-10 {

   padding-top: 10px !important;

  }

   .pt-20 {

   padding-top: 20px !important;

  }

   .pt-30 {

   padding-top: 30px !important;

  }

   .fs-account {

   font-size: 9px !important;

   line-height: 16px !important;

  }

   .fs-13 {

   font-size: 13px !important;

   line-height: 20px !important;

  }

   .fs-14 {

   font-size: 14px !important;

   line-height: 21px !important;

  }

   .fs-15 {

   font-size: 15px !important;

   line-height: 23px !important;

  }

   .fs-16 {

   font-size: 16px !important;

   line-height: 24px !important;

  }

   .fs-22 {

   font-size: 22px !important;

   line-height: 34px !important;

  }

  }

   @media only screen and (max-device-width: 414px) {

   .hide-content-sml {

   display: none !important;

   max-height: 0 !important;

   mso-hide: all !important;

   overflow: hidden !important;

   visibility: hidden !important;

  }

   .show-content-sml {

   display: block !important;

   max-height: none !important;

   mso-hide: none !important;

   overflow: visible !important;

   visibility: visible !important;

  }

  }


  </style>

   <!-- Progressive Enhancements : END -->

  

</head>

<body width="100%" style="margin: 0; padding: 0 !important; mso-line-height-rule: exactly; background-color: #E5E5E5;">

   <center style="width: 100%; background-color: #E5E5E5;">

   <!--[if mso | IE]>

  <table cellspacing="0" cellpadding="0" border="0" width="100%" style="background-color: #E5E5E5;">

  <tr>

  <td>

  <![endif]-->


   <div class="nl-dce-variant nl-dce-variant-block nl-dce-if nl-dce-multiconditional" data-nl-variant-group="1564624641933" data-nl-variant-label="Test" data-nl-variant-index="1" data-nl-expr="" data-nl-condition-type="multiple">

   <table align="center" cellspacing="0" cellpadding="0" border="0" width="600" style="margin: auto; width: 600px;" class="email-container">


   <tr>

   <td style="padding: 0px; background-color: #FFFFFF;">

  Test

   </td>

   </tr>


   </table>

   </div>


   <div class="nl-dce-variant nl-dce-variant-block nl-dce-if nl-dce-multiconditional nl-dce-current-variant" data-nl-variant-group="1564624641933" data-nl-variant-label="Default" data-nl-variant-index="0" data-nl-expr="" data-nl-condition-type="multiple" data-nl-variant-default="true">

   <table align="center" cellspacing="0" cellpadding="0" border="0" width="600" style="margin: auto; width: 600px;" class="email-container">


   <tr>

   <td style="padding: 0px; background-color: #FFFFFF;">

  Test Default

   </td>

   </tr>


   </table>

   </div>


   <!--[if mso | IE]>

  </td>

  </tr>

  </table>

  <![endif]-->

   </center>

</body>

</html>