GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
Other
22.61k stars 4.09k forks source link

addType in domcomponent for html conditionals doesn't work grapesjs 0.10.7 version #1254

Closed alperenuzun closed 6 years ago

alperenuzun commented 6 years ago

Hi Artur,

First of all, thank you for sharing such a great project :) I want to tell you a problem that I have experienced.

You commented below code for addType in #208 issue.

    var textnodeType = domc.getType('textnode');
    domc.addType('comment', {
      model: textnodeType.model.extend({
        toHTML() {
          return `<!--${this.get('content')}-->`;
        },
      },{
        isComponent(el) {
          if (el.nodeType == 8) {
            return {
              tagName: 'NULL', // just need this to avoid some parser rule
              type: 'comment',
              content: el.textContent
            }
          }
        },
      }),
      view: textnodeType.view,
    });

I was using grapesjs - v0.5.41 before using grapesjs - v0.10.7 and i wanted to add category structure for blocks in grapesjs newsletter plugin. And then, i realize that grapesjs - v0.10.7 already contained what i want. So, category structure is working very well but, above code doesn't work with grapesjs - v0.10.7 and doesn't include conditional comments. However, it worked with v0.5.41.

What is the reason for this? What should i do? Thanks for your answers.

artf commented 6 years ago

Hi @alperenuzun we don't support old versions so, please try to update to the latest and check if everything works. By the way, when you add new components be sure to do it from a plugin.

alperenuzun commented 6 years ago

"Plugin" was the answer for me :) In old versions it worked without using plugin. Now, it's working with plugin. Thank you very much for your help.

alperenuzun commented 6 years ago

Hi @artf

I've got another question. Conditional comments are working well but don't look correct on design.

This is the code that i used the conditional comments in:

yorumlukod

This is the design that i used conditional comments in:

yorumlutasarim

This is the code that i didn't use conditional comments in:

yorumsuzkod

This is the design that i didn't use conditional comments:

yorumsuztasarim

I realized that the editor adds a div right before the container divs which are styled with inline-block:

taslak

This is my html code before didn't parsed by editor:

<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>%%konu%%</title>
    <style type="text/css">/* Client-specific Styles */
        #outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
        body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
        /* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
        .ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
        .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing.*/
        img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
        a img {border:none;text-decoration:none;border:none; -ms-interpolation-mode: bicubic;}
        a { color:#616161; text-decoration:none }
        p { padding:0 !important; margin:0 !important } 

        .text-footer-2 a { color: #b1b1b1; text-decoration: none; }

     @media only screen and (max-width: 590px) {
         table.container{
                width:100% !important;
            }
        div.container{
                width:100% !important;
            }
        .full {
                display:block;
                width:100%;
            }
        table.deviceWidth {
            width:100% !important;
            }
        table.container2 {
                float: none !important;
                width: 0 !important;
            }
        div.container2 {
                float: none !important;
                width: 0 !important;
            }
        img.resim {
                width:100% !important;
                height:auto !important;
            }
        img.banner {
                width:100% !important;
            }
        td.padding {
                padding-top:25px !important;
            }
        td.text-center {
            text-align:center !important;
            }
        div.genislik100{
            width:100% !important;
            }
        td.yazi {
            text-align:center !important;
            }
        td.padding {
            width:0 !important; 
            }
        td.pleft {
            padding-left:0 !important;
            }
     }
    </style>
</head>
<body bgcolor="#eae9e9" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0">
<table align="center" bgcolor="#eae9e9" border="0" cellpadding="0" cellspacing="0" width="100%">
    <tbody>
        <tr>
            <td height="5" style="background-color:#9eb3cd;" valign="top"></td>
        </tr>
        <tr>
            <td align="center" bgcolor="white">
            <table border="0" cellpadding="0" cellspacing="0" class="container" width="590">
                <tbody>
                    <tr>
                        <td align="center"><!--[if (gte mso 9)|(IE)]>
                        <table width="590" align="center" cellpadding="0" cellspacing="0" border="0">
                          <tr>
                             <td>
                        <![endif]-->
                        <table border="0" cellpadding="0" cellspacing="0" class="container" style="max-width: 590px;" width="590">
                            <tbody>
                                <tr>
                                    <td bgcolor="#FFFFFF" style="text-align: center; font-size: 0;"><!--[if (gte mso 9)|(IE)]>
                                    <table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
                                        <tr>
                                            <td>
                                    <![endif]-->
                                    <div align="center" style="width: 150px; display: inline-block; vertical-align: middle;">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0" width="145">
                                        <tbody>
                                            <tr>
                                                <td align="center"><a href="http://keiretsuforum.com.tr/"><img alt="Lütfen Resimleri Görüntüleyiniz" border="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/logo-140x60.png" width="140" /></a></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                         </td>
                                         <td>
                                    <![endif]-->

                                    <div align="center" class="container2" style="width: 230px; display: inline-block; vertical-align: middle;">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0" class="container2" width="230">
                                        <tbody>
                                            <tr>
                                                <td bgcolor="white" height="2"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                     </td>
                                      <td>
                                    <![endif]-->

                                    <div align="center" style="width: 200px; display: inline-block; vertical-align: middle;">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0" width="190">
                                        <tbody>
                                            <tr>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#9eb3cd;"><a href="#" style="text-decoration:none; color:#9eb3cd;">Home</a></td>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#9eb3cd;"><a href="#" style="text-decoration:none; color:#9eb3cd;">FAQ</a></td>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#9eb3cd;"><a href="#" style="text-decoration:none; color:#9eb3cd;">Contact</a></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>
                               </tr>
                             </table>
                                <![endif]--></td>
                                </tr>
                            </tbody>
                        </table>
                        <!--[if (gte mso 9)|(IE)]>
                        </td>
                     </tr>
                   </table>
                       <![endif]--></td>
                    </tr>
                    <tr>
                        <td bgcolor="#FFFFFF" height="10"></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td height="5" style="background-color:#ffffff; border-bottom:#d5d5d5 solid 1px;" valign="top"></td>
        </tr>
        <tr>
            <td align="center" valign="top"><a href="#"><img alt="header-590x300" border="0" class="resim" hspace="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/image-header-590x260.jpg" style="max-width:590px;" vspace="0" width="590" /></a></td>
        </tr>
        <tr>
            <td align="center" bgcolor="#9eb3cd">
            <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="590">
                <tbody>
                    <tr>
                        <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:14px; padding:15px; color:white;"><b style="font-size:18px;">Deluxe Column</b><br />
                        <br />
                        Lorem ipsum dolor sit amet,consectetur adipisicing elit, sed do eimod tempor incididunt utlabore etdolore magna aliqua. Ut enim minimetdolore magna aliqua. Ut enim minim utlabore etdolore magna aliqua. Ut enim minimetdolore</td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td height="20"></td>
        </tr>
        <tr>
            <td align="center">
            <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="590">
                <tbody>
                    <tr>
                        <td bgcolor="white" class="pleft" height="30" style="padding-left:20px; padding-top:10px; padding-right:20px;" valign="bottom">
                        <table align="left" border="0" cellpadding="0" cellspacing="0" height="25">
                            <tbody>
                                <tr>
                                    <td style="background-color:#9eb3cd; font-size: 12px; line-height: 16px; font-family: Arial, Helvetica, sans-serif,Tahoma; color:#ffffff; font-weight:normal; text-align:left; padding-left:10px; padding-right:10px;" valign="mindle" width="auto"><span style="color: #ffffff; font-weight: normal;">Deluxe</span></td>
                                    <td style="background-color:#9eb3cd;" valign="top"><img alt="triangle" id="bg-tab-heading" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/red/triangle.png" style="display:block; max-width:30px; background-color:#9eb3cd;" width="30" /></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" bgcolor="white">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="550">
                            <tbody>
                                <tr>
                                    <td bgcolor="#9eb3cd" height="2" width="100%"></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" valign="top"><!--[if (gte mso 9)|(IE)]>
                <table width="590" align="center" cellpadding="0" cellspacing="0" border="0">
                  <tr>
                     <td>
                <![endif]-->
                        <table border="0" cellpadding="0" cellspacing="0" class="container" style="max-width: 590px;" width="590">
                            <tbody>
                                <tr>
                                    <td bgcolor="#FFFFFF" style="text-align: center; font-size: 0;"><!--[if (gte mso 9)|(IE)]>
                        <table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
                            <tr>
                                <td>
                        <![endif]-->
                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" class="container" width="280">
                                        <tbody>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center"><img alt="Lütfen Resimleri Görüntüleyiniz" border="0" class="resim" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/blue/image3-280x247.jpg" width="265" /></td>
                                            </tr>
                                            <tr>
                                                <td align="center" bgcolor="white" height="40" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#9eb3cd; font-weight:bold;">Image Column One</td>
                                            </tr>
                                            <tr>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; color:#7f7f7f; text-align:justify; padding-left:10px; padding-right:10px;">Kadın girişimciler, kadın iş&ccedil;iler, kadın patronlar, t&uuml;m kadınlar&hellip; Kız &ccedil;ocuklarımız, gen&ccedil; kızlarımız&hellip;</td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center">
                                                <table align="center" bgcolor="#9eb3cd" border="0" cellpadding="0" cellspacing="0" style="border-bottom:#5c718a solid 2px;" width="140">
                                                    <tbody>
                                                        <tr>
                                                            <td align="center" height="25" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:white; font-style:italic;" width="130"><a href="#" style="color:white; text-decoration:none;">Devamı İ&ccedil;in Tıklayınız</a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>
                                 <td>
                             <![endif]-->

                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" class="container" width="280">
                                        <tbody>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center"><img alt="Lütfen Resimleri Görüntüleyiniz" border="0" class="resim" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/blue/image3-280x247.jpg" width="265" /></td>
                                            </tr>
                                            <tr>
                                                <td align="center" bgcolor="white" height="40" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#9eb3cd; font-weight:bold;">Image Column One</td>
                                            </tr>
                                            <tr>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; color:#7f7f7f; text-align:justify; padding-left:10px; padding-right:10px;">Kadın girişimciler, kadın iş&ccedil;iler, kadın patronlar, t&uuml;m kadınlar&hellip; Kız &ccedil;ocuklarımız, gen&ccedil; kızlarımız&hellip;</td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center">
                                                <table align="center" bgcolor="#9eb3cd" border="0" cellpadding="0" cellspacing="0" style="border-bottom:#5c718a solid 2px;" width="140">
                                                    <tbody>
                                                        <tr>
                                                            <td align="center" height="25" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:white; font-style:italic;" width="130"><a href="#" style="color:white; text-decoration:none;">Devamı İ&ccedil;in Tıklayınız</a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>         
                               </tr>
                             </table>
                            <![endif]--></td>
                                </tr>
                            </tbody>
                        </table>
                        <!--[if (gte mso 9)|(IE)]>
                    </td>
                 </tr>
               </table>
       <![endif]--></td>
                    </tr>
                    <tr>
                        <td align="center">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="570">
                            <tbody>
                                <tr>
                                    <td bgcolor="#d4d2d2" height="4" width="100%"></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td height="20"></td>
        </tr>
        <tr>
            <td align="center">
            <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="590">
                <tbody>
                    <tr>
                        <td bgcolor="white" class="pleft" height="30" style="padding-left:20px; padding-top:10px; padding-right:20px;" valign="bottom">
                        <table align="left" border="0" cellpadding="0" cellspacing="0" height="25">
                            <tbody>
                                <tr>
                                    <td style="background-color:#9eb3cd; font-size: 12px; line-height: 16px; font-family: Arial, Helvetica, sans-serif,Tahoma; color:#ffffff; font-weight:normal; text-align:left; padding-left:10px; padding-right:10px;" valign="mindle" width="auto"><span style="color: #ffffff; font-weight: normal;">Deluxe</span></td>
                                    <td style="background-color:#9eb3cd;" valign="top"><img alt="triangle" id="bg-tab-heading" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/red/triangle.png" style="display:block; max-width:30px; background-color:#9eb3cd;" width="30" /></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" bgcolor="white">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="550">
                            <tbody>
                                <tr>
                                    <td bgcolor="#9eb3cd" height="2" width="100%"></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" valign="top"><!--[if (gte mso 9)|(IE)]>
                <table width="590" align="center" cellpadding="0" cellspacing="0" border="0">
                  <tr>
                     <td>
                <![endif]-->
                        <table border="0" cellpadding="0" cellspacing="0" class="container" style="max-width: 590px;" width="590">
                            <tbody>
                                <tr>
                                    <td bgcolor="#FFFFFF" style="text-align: center; font-size: 0;"><!--[if (gte mso 9)|(IE)]>
                        <table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
                            <tr>
                                <td>
                        <![endif]-->
                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" class="container" width="280">
                                        <tbody>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center"><img alt="Lütfen Resimleri Görüntüleyiniz" border="0" class="resim" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/blue/image3-280x247.jpg" width="265" /></td>
                                            </tr>
                                            <tr>
                                                <td align="center" bgcolor="white" height="40" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#9eb3cd; font-weight:bold;">Image Column One</td>
                                            </tr>
                                            <tr>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; color:#7f7f7f; text-align:justify; padding-left:10px; padding-right:10px;">Kadın girişimciler, kadın iş&ccedil;iler, kadın patronlar, t&uuml;m kadınlar&hellip; Kız &ccedil;ocuklarımız, gen&ccedil; kızlarımız&hellip;</td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center">
                                                <table align="center" bgcolor="#9eb3cd" border="0" cellpadding="0" cellspacing="0" style="border-bottom:#5c718a solid 2px;" width="140">
                                                    <tbody>
                                                        <tr>
                                                            <td align="center" height="25" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:white; font-style:italic;" width="130"><a href="#" style="color:white; text-decoration:none;">Devamı İ&ccedil;in Tıklayınız</a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>
                                 <td>
                             <![endif]-->

                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" class="container" width="280">
                                        <tbody>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center"><img alt="Lütfen Resimleri Görüntüleyiniz" border="0" class="resim" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/blue/image3-280x247.jpg" width="265" /></td>
                                            </tr>
                                            <tr>
                                                <td align="center" bgcolor="white" height="40" style="font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#9eb3cd; font-weight:bold;">Image Column One</td>
                                            </tr>
                                            <tr>
                                                <td align="center" style="font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:20px; color:#7f7f7f; text-align:justify; padding-left:10px; padding-right:10px;">Kadın girişimciler, kadın iş&ccedil;iler, kadın patronlar, t&uuml;m kadınlar&hellip; Kız &ccedil;ocuklarımız, gen&ccedil; kızlarımız&hellip;</td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                            <tr>
                                                <td align="center">
                                                <table align="center" bgcolor="#9eb3cd" border="0" cellpadding="0" cellspacing="0" style="border-bottom:#5c718a solid 2px;" width="140">
                                                    <tbody>
                                                        <tr>
                                                            <td align="center" height="25" style="font-family:Arial, Helvetica, sans-serif; font-size:12px; color:white; font-style:italic;" width="130"><a href="#" style="color:white; text-decoration:none;">Devamı İ&ccedil;in Tıklayınız</a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td bgcolor="white" height="10"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>         
                               </tr>
                             </table>
                            <![endif]--></td>
                                </tr>
                            </tbody>
                        </table>
                        <!--[if (gte mso 9)|(IE)]>
                    </td>
                 </tr>
               </table>
       <![endif]--></td>
                    </tr>
                    <tr>
                        <td align="center">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="570">
                            <tbody>
                                <tr>
                                    <td bgcolor="#d4d2d2" height="4" width="100%"></td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td height="20"></td>
        </tr>
        <tr>
            <td align="center">
            <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="590">
                <tbody>
                    <tr>
                        <td align="center" valign="top"><!--[if (gte mso 9)|(IE)]>
                <table width="590" align="center" cellpadding="0" cellspacing="0" border="0">
                  <tr>
                     <td>
                <![endif]-->
                        <table border="0" cellpadding="0" cellspacing="0" class="container" style="max-width: 590px;" width="590">
                            <tbody>
                                <tr>
                                    <td style="text-align: center; font-size: 0;"><!--[if (gte mso 9)|(IE)]>
                        <table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
                            <tr>
                                <td>
                        <![endif]-->
                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0" width="275">
                                        <tbody>
                                            <tr>
                                                <td height="15"></td>
                                            </tr>
                                        </tbody>
                                    </table>

                                    <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="275">
                                        <tbody>
                                            <tr>
                                                <td class="yazi" style="font-size: 13px; line-height: 18px; font-family: Arial, Helvetica, sans-serif,Tahoma; color:#919191; font-weight:normal; text-align:left;" valign="top"><multiline>Company Name : <span style="color: #919191; font-weight: normal;">1234 Street Stage Post 12345</span><br />
                                                Mail Us : <span style="color: #9eb3cd; font-weight: normal;"><a href="#" style="text-decoration: none; color: #e5b05c; font-weight: normal;">info@youemail.com</a></span><br />
                                                Call Us : 001-1234-5678</multiline></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>
                                 <td>
                             <![endif]-->

                                    <div align="center" class="container" style="width: 280px; display: inline-block; vertical-align: top;">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" width="275">
                                        <tbody>
                                            <tr>
                                                <td height="15" valign="top"></td>
                                            </tr>
                                            <tr>
                                                <td align="center" valign="top">
                                                <table align="center" border="0" cellpadding="0" cellspacing="0" class="full-width">
                                                    <tbody>
                                                        <tr>
                                                            <td align="center" height="50" id="clear-padding" valign="mindle"><a href="#"><img alt="icon-googleplus" border="0" hspace="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/icon-googleplus.png" style="max-width:35px;" vspace="0" width="35" /> </a></td>
                                                            <td align="center" height="50" id="clear-padding" style="padding-left:20px; " valign="mindle"><a href="#"><img alt="icon-facebook" border="0" hspace="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/icon-facebook.png" style="max-width:35px;" vspace="0" width="35" /> </a></td>
                                                            <td align="center" height="50" id="clear-padding" style="padding-left:20px; " valign="mindle"><a href="#"><img alt="icon-twitter" border="0" hspace="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/icon-twitter.png" style="max-width:35px;" vspace="0" width="35" /> </a></td>
                                                            <td align="center" height="50" id="clear-padding" style="padding-left:20px;" valign="mindle"><a href="#"><img alt="icon-youtube" border="0" hspace="0" src="http://stock.setrow.com/sablon_kategori_resimleri/tf_5547484/gold/icon-youtube.png" style="max-width:35px;" vspace="0" width="35" /> </a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    </div>
                                    <!--[if (gte mso 9)|(IE)]>
                                 </td>         
                               </tr>
                             </table>
                            <![endif]--></td>
                                </tr>
                            </tbody>
                        </table>
                        <!--[if (gte mso 9)|(IE)]>
                    </td>
                 </tr>
               </table>
       <![endif]--></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td height="20"></td>
        </tr>
        <tr>
            <td align="center" bgcolor="#0e2430" style="background-color:#0e2430; " valign="top">
            <table bgcolor="#0e2430" border="0" cellpadding="0" cellspacing="0" class="container" style="background-color:#0e2430; padding-left:20px; padding-right:20px;" width="590">
                <tbody>
                    <tr>
                        <td height="15"></td>
                    </tr>
                    <tr><!-- start unsubscribe content -->
                        <td valign="top">
                        <table align="center" border="0" cellpadding="0" cellspacing="0">
                            <tbody>
                                <tr>
                                    <td align="center" class="text-center" style="font-size: 13px; line-height: 20px; font-family: Arial, Helvetica, sans-serif,Tahoma; color:#919191; font-weight:normal; text-align:center;">
                                    <div class="text-center" style="text-align:center;"><multiline>This email was sent to <span style="color: #e5b05c; font-weight: bold;"><a href="#" style="text-decoration: none; color: #e5b05c; font-weight: normal;">your@email.com.</a></span> You received this email because you are registered on <span style="color: #e5b05c; font-weight: bold;"><a href="#" style="text-decoration: none; color: #e5b05c; font-weight: normal;">yourdomain.com.</a></span> We respect your privacy. You can <span style="color: #e5b05c; font-weight: normal;"><a href="#" style="text-decoration: none; color: #e5b05c; font-weight: normal;"><unsubscribe style="text-decoration: none; color: #e5b05c; font-weight: normal;"> </unsubscribe></a></span>unsubscribe from Important Updates or manage your email settings on <span style="color: #e5b05c; font-weight: bold;"><a href="#" style="text-decoration: none; color: #e5b05c; font-weight: normal;">yourdomain.com</a></span></multiline></div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        </td>
                        <!-- end unsubscribe content -->
                    </tr>
                    <tr>
                        <td height="15"></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
        <tr>
            <td align="center" bgcolor="#161616" style="background-color:#161616; " valign="top">
            <table bgcolor="#161616" border="0" cellpadding="0" cellspacing="0" class="container" style="background-color:#161616; " width="580">
                <tbody>
                    <tr>
                        <td height="10"></td>
                    </tr>
                    <tr><!-- start COPY RIGHT content -->
                        <td style="font-size: 13px; line-height: 20px; font-family: Arial, Helvetica, sans-serif,Tahoma; color:#919191; font-weight:normal; text-align:center; " valign="top"><singleline>Your company here , all rights reserved 2017 &copy; </singleline></td>
                        <!-- end COPY RIGHT content -->
                    </tr>
                    <tr>
                        <td height="10"></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
    </tbody>
</table>
</body>
</html>

Why does the editor behave like that ? What should i do? Thanks for your helps.

artf commented 6 years ago

@alperenuzun as I said, we don't support old versions, so try to upgrade please and in case you still face the problem open a new issue and follow its template

lock[bot] commented 5 years ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.