Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

Bug: Dynamic Content Hidden Character

thomasjohnausti
Level 1
Level 1

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

1 Accepted Solution
thomasjohnausti
Correct answer by
Level 1
Level 1

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

View solution in original post

5 Replies
thomasjohnausti
Level 1
Level 1
<!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>

thomasjohnausti
Level 1
Level 1

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.

DimaKudryavtsev
Level 4
Level 4

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

The code &#65279; 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
Correct answer by
Level 1
Level 1

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

View solution in original post