Announcement

Collapse
No announcement yet.

Style section in email - problem with email code

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Style section in email - problem with email code

    When I insert an email template code containing a <style> section that includes information about the responsiveness of the message, the editor removes the <style> tag, causing it not to function properly

    Code before insert to email editor (summernote - section source enabled)
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <!--[if !mso]><!--><meta http-equiv="X-UA-Compatible" content="IE=edge" /><!--<![endif]-->
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta name="x-apple-disable-message-reformatting">
        <title>Weronika</title>
        <style type="text/css">                
                html{width:100%}
                body{-webkit-text-size-adjust:none;-ms-text-size-adjust:none;margin:0;padding:0;font-family:'Open Sans',Arial,Sans-serif!important}
                table{border-spacing:0;table-layout:auto;margin:0 auto}
                img{display:block!important;overflow:hidden!important}
                a{text-decoration: none;color:unset}
                .ReadMsgBody{width:100%;background-color:#fff}
                .ExternalClass{width:100%;background-color:#fff}
                .ExternalClass,.ExternalClass p,.ExternalClass span,.ExternalClass font,.ExternalClass td,.ExternalClass div{line-height:100%}
                .yshortcuts a{border-bottom:none!important}
                .full{width:100%}
                .pad{width:92%}
                @media only screen and (max-width: 650px) {
                body{width:600px;}
                .res-pad{width:92%;max-width:92%}
                .res-full{width:100%;max-width:100%}
                .res-left{text-align:left!important}
                .res-right{text-align:right!important}
                .res-center{text-align:center!important}
                }@media only screen and (max-width: 750px) {
                .margin-full{width:100%;max-width:100%}
                .margin-pad{width:92%;max-width:92%;max-width:600px}
                }
        </style>
    </head>
    <body>
    The same code after click disabled section source

    HTML Code:
    
    
        
        <!--[if !mso]><!--><!--<![endif]-->
        
        
        Weronika
                        
                html{width:100%}
                body{-webkit-text-size-adjust:none;-ms-text-size-adjust:none;margin:0;padding:0;font-family:'Open Sans',Arial,Sans-serif!important}
                table{border-spacing:0;table-layout:auto;margin:0 auto}
                img{display:block!important;overflow:hidden!important}
                a{text-decoration: none;color:unset}
                .ReadMsgBody{width:100%;background-color:#fff}
                .ExternalClass{width:100%;background-color:#fff}
                .ExternalClass,.ExternalClass p,.ExternalClass span,.ExternalClass font,.ExternalClass td,.ExternalClass div{line-height:100%}
                .yshortcuts a{border-bottom:none!important}
                .full{width:100%}
                .pad{width:92%}
                @media only screen and (max-width: 650px) {
                body{width:600px;}
                .res-pad{width:92%;max-width:92%}
                .res-full{width:100%;max-width:100%}
                .res-left{text-align:left!important}
                .res-right{text-align:right!important}
                .res-center{text-align:center!important}
                }@media only screen and (max-width: 750px) {
                .margin-full{width:100%;max-width:100%}
                .margin-pad{width:92%;max-width:92%;max-width:600px}
                }
        
    
    ​

    Where can I disable the removal of style sections and other header elements? I know it opens up vulnerability to XSS attacks, but I need to enable this section so that emails are responsive.

  • #2
    as far as I know, you cannot disable stripping of style. You may try as a workaround to convert your HTML and CSS to inline style. There are converters online available, which can do that for you.

    Comment


    • the-web
      the-web commented
      Editing a comment
      I tried to bypass it by converting, but responsiveness is not available in the inline option.

  • #3
    Use inline style for email templates. Style tags are often stripped by email clients.

    Comment


    • #4
      inline editor doesn't work - I need disable option remove text "<style> " - only this

      Comment


      • shalmaxb
        shalmaxb commented
        Editing a comment
        I create newsletter templates with the editor and they are responsive. All constructed with inline style.

    • #5
      up ?? Anybody ??

      Comment

      Working...
      X