响应式电子邮件模板无效

时间:2016-09-14 11:49:35

标签: html css html5 css3 email-templates

我正在制作一个电子邮件模板,其中包含左侧图像和右侧文本栏的表格。第一张图像和右侧的段落不会随着屏幕尺寸的减小而排列。看起来很奇怪。但是,相同的属性对其余行正常工作。它们都按照所需的顺序排列。

enter image description here enter image description here



* {
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px;
  border: none;
  line-height: normal;
  outline: none;
  list-style: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
}
body {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  width: 100% !important;
  -webkit-text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  -webkit-font-smoothing: antialiased !important;
}
table {
  border-collapse: collapse !important;
  padding: 0px !important;
  border: none !important;
  mso-table-lspace: 0pt;
  mso-table-rspace: 0pt;
}
table td {
  border-collapse: collapse;
  mso-line-height-rule: exactly;
}
.ExternalClass* {
  line-height: 100% !important;
}
img {
  border: 0 !important;
  outline: none !important;
  display: block !important;
}
.view_text a {
  text-decoration: underline;
  color: #f06022;
}
.forward_text a {
  text-decoration: underline;
  color: #7fc413;
}
.top_text a {
  text-decoration: none;
  color: #000000;
}
.read_more a {
  text-decoration: none;
  color: #ffffff;
}
.web_text a {
  text-decoration: none;
  color: #8b8b8b;
}
.manage_text a {
  text-decoration: underline;
  color: #8b8b8b;
}
.mail_text a {
  text-decoration: underline;
  color: #f06122;
}
table .main_table {
  width: 650px;
}
@media only screen and (min-width: 481px) and (max-width: 600px) {
  table[class=main_table] {
    width: 480px !important;
  }
  table[class=wrapper] {
    width: 100% !important;
  }
  td[class=hide],
  span[class=hide],
  br[class=hide] {
    display: none !important;
  }
  td[class=pad_btm] {
    padding-bottom: 25px !important;
  }
  td[class=spacer] {
    width: 10px !important;
  }
  td[class=txt_dvd] {
    text-align: center !important;
  }
  table[class=contact] {
    width: 225px !important;
  }
}
@media only screen and (max-width: 480px) {
  table[class=main_table] {
    width: 320px !important;
  }
  table[class=wrapper] {
    width: 100% !important;
  }
  td[class=logo],
  img[class=logo] {
    width: 125px !important;
    height: auto !important;
  }
  td[class=pad_btm] {
    padding-bottom: 25px !important;
  }
  td[class=**_txt] {
    font-size: 18px !important;
  }
  td[class=txt_dvd] {
    text-align: center !important;
  }
  td[class=spacer] {
    width: 10px !important;
  }
  td[class=hide],
  span[class=hide],
  br[class=hide] {
    display: none !important;
  }
  td[class=mob_height] {
    height: 5px !important;
  }
  table[class=contact] {
    width: 225px !important;
  }
}

<body marginwidth="0" marginheight="0" style="margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; width: 100% !important;-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;" offset="0" topmargin="0"
leftmargin="0" bgcolor="#ffffff">
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">

    <tr>
      <td valign="top">
        <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
          <tr>
            <td align="left" valign="top">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td class="hide" height="1" style="line-height:1px; min-width: 600px;">
                    <img src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/78d51c00-1e8b-428c-a4ed-a3430ed9f46a.gif" width="600" height="1" alt="" style="max-height:1px; min-height:1px; display:block; width:600px; min-width:600px;" border="0">
                  </td>
                </tr>
                <tr>
                  <td>
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td></td>
                        <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                        <td></td>
                      </tr>
                      <tr>
                        <td width="36" class="spacer"></td>
                        <td align="left" valign="top">
                          <table width="578" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="400" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; color:#000000; text-align:left;" mc:edit="top_text">Be sure to add <span class="top_text"><a href="mailto:mailings@*.com" style="text-decoration:none; color:#000000;">mailings@*.com</a></span> to
                                      <br>your address book or safe sender list so our emails get to your inbox.</td>
                                  </tr>
                                </table>
                                <table width="150" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td height="6" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                  <tr>
                                    <td align="right" valign="middle" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; font-weight:bold; color:#f06022; text-align:right;" mc:edit="verson_text"><span class="view_text"><a href="*|ARCHIVE|*" target="_blank" style="text-decoration:underline; color:#f06022;">View online</a></span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="forward_text"><a href="*|FORWARD|*" target="_blank" style="text-decoration:underline; color:#7fc413;">Forward</a></span>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                          </table>
                        </td>
                        <td width="36" class="spacer"></td>
                      </tr>
                      <tr>
                        <td></td>
                        <td height="8" style="line-height:0px; font-size:0px;">&nbsp;</td>
                        <td></td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top" bgcolor="#000000">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td></td>
                  <td height="30"></td>
                  <td></td>
                </tr>
                <tr>
                  <td width="71" class="spacer"></td>
                  <td align="center" valign="top">
                    <a href="http://www.*.com.au" target="_blank">
                      <img mc:edit="top_logo" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1b44993e-ab5b-4da1-9cc4-a38fff4ae839.png" alt="Direct Sites Online" border="0" style="display:block; width:100%;">
                    </a>
                  </td>
                  <td width="64" class="spacer"></td>
                </tr>
                <tr>
                  <td></td>
                  <td height="32"></td>
                  <td></td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top" bgcolor="#f2f2f2">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td></td>
                  <td height="28"></td>
                  <td></td>
                </tr>
                <tr>
                  <td width="20" class="spacer"></td>
                  <td align="left" valign="top">
                    <table width="595" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                      <tr>
                        <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td colspan="2" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">*|IF:FNAME|*Dear *|TITLE:FNAME|*,*|ELSE:|*Hello,*|END:IF|*
                              </td>
                            </tr>
                            <tr>
                              <td width="210" height="304" align="center" valign="top" class="pad_btm">
                                <img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/4df8680f-973f-4c60-9412-7b953535d5a0.jpg" width="200" height="304" alt="xmas" border="0" style="display:block;">
                              </td>
                              <td width="370" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:14px; color:#0f0f0f; line-height:18px; text-align:justify;" mc:edit="dear_text">
                                <p align="justify" style="padding:0px 0px;text-align:justify;">As famously once said, “If you’re interested in the living heart of what you do, focus on building things rather than talking about them.”
                                  <br>
                                  <br>In this month's newsletter we have a great article on what not to do when revamping or starting out with a new web site design for your business. Also how to start incorporating local SEO (search engine optimisation)
                                  in the success strategy for your business.</p>
                                <p align="justify" style="padding:0px 0px;text-align:justify;">
                                  <br>As always, if you would like further information or assistance please feel free to contact us. If you would like to implement and or discuss any of the articles or recommendations in our newsletter please feel free to
                                  contact us.</p>
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      <tr>
                        <td height="22"></td>
                      </tr>
                      <tr>
                        <td align="left" valign="top">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="260" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="with_text">With thanks and best regards,</td>
                                  </tr>
                                  <tr>
                                    <td height="18"></td>
                                  </tr>
                                  <tr>
                                    <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; font-weight:bold; line-height:18px; text-align:left;" mc:edit="peter_text">Peter N. Flint</td>
                                  </tr>

                                  <tr>
                                    <td height="18" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                </table>
                                <table width="180" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top">
                                      <table width="180" border="0" align="center" cellpadding="0" cellspacing="0">
                                        <tr>
                                          <td width="26" align="left" valign="top">
                                            <a href="http://www.facebook.com/*" target="_blank">
                                              <img mc:edit="fb" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d93affec-486e-4020-aa6e-7aa2d320cc6d.jpg" width="26" height="26" alt="Facebook" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://twitter.com/DirectSites" target="_blank">
                                              <img mc:edit="tweet" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/30d7dafd-8973-4bd4-a174-d7ad09a1f48c.jpg" width="26" height="26" alt="Twitter" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a target="_blank">
                                              <img mc:edit="sky" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/ae3d2cb4-9d8e-477a-9407-ad1f58ab0e22.jpg" width="26" height="26" alt="Skype" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="4"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://plus.google.com/100692187112615457693/posts" target="_blank">
                                              <img mc:edit="google" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/bd2d9723-43f8-43c4-bd53-c018a047c4b5.jpg" width="26" height="26" alt="Google Plus" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="http://www.linkedin.com/company/direct-sites-online" target="_blank">
                                              <img mc:edit="linked" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d6c04a93-f07a-4d41-83a8-29471d1e62fe.jpg" width="26" height="26" alt="Linkedin" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://www.youtube.com/user/*" target="_blank">
                                              <img mc:edit="you" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/511a6d1b-f46d-4fdd-9612-4fd5ccad8220.jpg" width="26" height="26" alt="You Tube" border="0" style="display:block;">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                  <tr>
                                    <td align="right" valign="top">
                                      <table width="113" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td align="center" valign="top">
                                            <a href="http://www.*.com.au" target="_blank">
                                              <img mc:edit="**" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1bb167db-01ff-4cda-aaf4-b30dc1d14605.jpg" width="113" height="19" alt="Direct Sites Online">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                  </td>
                  <td width="35" class="spacer"></td>
                </tr>
                <tr>
                  <td></td>
                  <td height="32"></td>
                  <td></td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table" mc:repeatable="">
                <tr>
                  <td align="left" valign="top">
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td align="left" valign="top" bgcolor="#f06122">
                          <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                            <tr>
                              <td></td>
                              <td height="26"></td>
                              <td></td>
                            </tr>
                            <tr>
                              <td width="35" class="spacer"></td>
                              <td align="left" valign="top" class="**_txt" style="font-family:Arial, sans-serif; font-size:23px; color:#ffffff; line-height:normal; text-align:center;" mc:edit="**_news"><span style="font-weight:bold;">**</span> News and <span style="font-weight:bold;">BLOG</span> articles</td>
                              <td width="25" class="spacer"></td>
                            </tr>
                            <tr>
                              <td></td>
                              <td height="26"></td>
                              <td></td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      <tr>
                        <td height="30"></td>
                      </tr>
                    </table>
                  </td>
                </tr>
                <tr>
                  <td align="left" valign="top">
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td width="35" class="spacer"></td>
                        <td align="left" valign="top">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top">
                                      <table width="219" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td height="5" style="line-height:0px; font-size:0px;" class="hide">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top" class="pad_btm">
                                            <a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank">
                                              <img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/c4a9748a-32b7-4500-97a6-a67b42c76030.png" width="219" height="146" alt="Tis the season for email marketing" border="0"
                                              style="display:block;">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                      <table width="340" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:18px; color:#f06022; line-height:normal; text-align:left;" mc:edit="website_text">Start incorporating local seo in the success strategy for your business</td>
                                        </tr>
                                        <tr>
                                          <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="building_text">You have probably heard about SEO (stands for Search Engine Optimisation), but how about local SEO? Do you know the difference between the two? Well, one thing is for sure, and that is that SEO optimizes the content
                                            of your website according to the requirements of search engines so that they will appear in search result inquiries.
                                            <br class="hide">
                                            <a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff;"><span style="color:#5e5e5e; line-height:18px;">Continue Here - Read more of this article which is located on our blog.</span></a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td height="22" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="left" valign="top">
                                            <table width="132" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                              <tr>
                                                <td align="left" valign="top">
                                                  <table width="132" border="0" align="center" cellpadding="0" cellspacing="0">
                                                    <tr>
                                                      <td width="8" align="left" valign="top">
                                                        <img mc:edit="curve" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/18ca4c30-13b9-46c8-94eb-2f763c7cd6f3.png" width="8" height="35" alt="" border="0" style="display:block;">
                                                      </td>
                                                      <td align="center" valign="middle" bgcolor="#000000" class="read_more" style="font-family:Arial, sans-serif; background-color:#000000; font-size:14px; color:#ffffff; line-height:18px; text-align:center;" mc:edit="more_text"><a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff; display:block;">Read More</a>
                                                      </td>
                                                      <td width="8" align="left" valign="top">
                                                        <img mc:edit="curve1" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/b06c0f3e-b1af-4af8-b110-da2c5cf37e47.png" width="8" height="35" alt="" border="0" style="display:block;">
                                                      </td>
                                                    </tr>
                                                  </table>
                                                </td>
                                              </tr>
                                            </table>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

我在这里做了一些改变,并希望你的要求能够实现。

补充:

@media only screen and (max-width: 480px) {
td[class=pad_btm] {
    padding-bottom: 25px !important;
    float: left;
    width: 100%;
  }
}

添加了文字td样式

style="float: left;"

以下是编辑过的部分。

* {
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px;
  border: none;
  line-height: normal;
  outline: none;
  list-style: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
}
body {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  width: 100% !important;
  -webkit-text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  -webkit-font-smoothing: antialiased !important;
}
table {
  border-collapse: collapse !important;
  padding: 0px !important;
  border: none !important;
  mso-table-lspace: 0pt;
  mso-table-rspace: 0pt;
}
table td {
  border-collapse: collapse;
  mso-line-height-rule: exactly;
}
.ExternalClass* {
  line-height: 100% !important;
}
img {
  border: 0 !important;
  outline: none !important;
  display: block !important;
}
.view_text a {
  text-decoration: underline;
  color: #f06022;
}
.forward_text a {
  text-decoration: underline;
  color: #7fc413;
}
.top_text a {
  text-decoration: none;
  color: #000000;
}
.read_more a {
  text-decoration: none;
  color: #ffffff;
}
.web_text a {
  text-decoration: none;
  color: #8b8b8b;
}
.manage_text a {
  text-decoration: underline;
  color: #8b8b8b;
}
.mail_text a {
  text-decoration: underline;
  color: #f06122;
}
table .main_table {
  width: 650px;
}
@media only screen and (min-width: 481px) and (max-width: 600px) {
  table[class=main_table] {
    width: 480px !important;
  }
  table[class=wrapper] {
    width: 100% !important;
  }
  td[class=hide],
  span[class=hide],
  br[class=hide] {
    display: none !important;
  }
  td[class=pad_btm] {
    padding-bottom: 25px !important;
  }
  td[class=spacer] {
    width: 10px !important;
  }
  td[class=txt_dvd] {
    text-align: center !important;
  }
  table[class=contact] {
    width: 225px !important;
  }
}
@media only screen and (max-width: 480px) {
table[class=main_table] {
    width: 320px !important;
    
  }
  table[class=wrapper] {
    width: 100% !important;
  }
  td[class=logo],
  img[class=logo] {
    width: 125px !important;
    height: auto !important;
  }

td[class=pad_btm] {
    padding-bottom: 25px !important;
    float: left;
    width: 100%;
    
}
td[class=**_txt] {
    font-size: 18px !important;
  }
  td[class=txt_dvd] {
    text-align: center !important;
  }
  td[class=spacer] {
    width: 10px !important;
  }
  td[class=hide],
  span[class=hide],
  br[class=hide] {
    display: none !important;
  }
  td[class=mob_height] {
    height: 5px !important;
  }
  table[class=contact] {
    width: 225px !important;
  }
}
<body marginwidth="0" marginheight="0" style="margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; width: 100% !important;-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;" offset="0" topmargin="0" leftmargin="0" bgcolor="#ffffff">
  <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
      <td valign="top">
        <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
          <tr>
            <td align="left" valign="top">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td class="hide" height="1" style="line-height:1px; min-width: 600px;">
                    <img src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/78d51c00-1e8b-428c-a4ed-a3430ed9f46a.gif" width="600" height="1" alt="" style="max-height:1px; min-height:1px; display:block; width:600px; min-width:600px;" border="0">
                  </td>
                </tr>
                <tr>
                  <td>
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td></td>
                        <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                        <td></td>
                      </tr>
                      <tr>
                        <td width="36" class="spacer"></td>
                        <td align="left" valign="top">
                          <table width="578" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="400" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; color:#000000; text-align:left;" mc:edit="top_text">Be sure to add <span class="top_text"><a href="mailto:mailings@*.com" style="text-decoration:none; color:#000000;">mailings@*.com</a></span> to
                                      <br>your address book or safe sender list so our emails get to your inbox.</td>
                                  </tr>
                                </table>
                                <table width="150" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td height="6" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                  <tr>
                                    <td align="right" valign="middle" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:11px; line-height:normal; font-weight:bold; color:#f06022; text-align:right;" mc:edit="verson_text"><span class="view_text"><a href="*|ARCHIVE|*" target="_blank" style="text-decoration:underline; color:#f06022;">View online</a></span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="forward_text"><a href="*|FORWARD|*" target="_blank" style="text-decoration:underline; color:#7fc413;">Forward</a></span>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                          </table>
                        </td>
                        <td width="36" class="spacer"></td>
                      </tr>
                      <tr>
                        <td></td>
                        <td height="8" style="line-height:0px; font-size:0px;">&nbsp;</td>
                        <td></td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top" bgcolor="#000000">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td></td>
                  <td height="30"></td>
                  <td></td>
                </tr>
                <tr>
                  <td width="71" class="spacer"></td>
                  <td align="center" valign="top">
                    <a href="http://www.*.com.au" target="_blank">
                      <img mc:edit="top_logo" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1b44993e-ab5b-4da1-9cc4-a38fff4ae839.png" alt="Direct Sites Online" border="0" style="display:block; width:100%;">
                    </a>
                  </td>
                  <td width="64" class="spacer"></td>
                </tr>
                <tr>
                  <td></td>
                  <td height="32"></td>
                  <td></td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top" bgcolor="#f2f2f2">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                <tr>
                  <td></td>
                  <td height="28"></td>
                  <td></td>
                </tr>
                <tr>
                  <td width="20" class="spacer"></td>
                  <td align="left" valign="top">
                    <table width="595" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                      <tr>
                        <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td colspan="2" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="dear_text">*|IF:FNAME|*Dear *|TITLE:FNAME|*,*|ELSE:|*Hello,*|END:IF|*
                              </td>
                            </tr>
                            <tr>
                              <td width="210" height="304" align="center" valign="top" class="pad_btm">
                                <img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/4df8680f-973f-4c60-9412-7b953535d5a0.jpg" width="200" height="304" alt="xmas" border="0" style="display:block;">
                              </td>
                              <td width="370" align="left" valign="top" style="font-family:Arial, sans-serif; font-size:14px; color:#0f0f0f; line-height:18px; text-align:justify; float: left;" mc:edit="dear_text">
                                <p align="justify" style="padding:0px 0px;text-align:justify;">As famously once said, “If you’re interested in the living heart of what you do, focus on building things rather than talking about them.”
                                  <br>
                                  <br>In this month's newsletter we have a great article on what not to do when revamping or starting out with a new web site design for your business. Also how to start incorporating local SEO (search engine optimisation)
                                  in the success strategy for your business.</p>
                                <p align="justify" style="padding:0px 0px;text-align:justify;">
                                  <br>As always, if you would like further information or assistance please feel free to contact us. If you would like to implement and or discuss any of the articles or recommendations in our newsletter please feel free to
                                  contact us.</p>
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      <tr>
                        <td height="22"></td>
                      </tr>
                      <tr>
                        <td align="left" valign="top">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="260" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="with_text">With thanks and best regards,</td>
                                  </tr>
                                  <tr>
                                    <td height="18"></td>
                                  </tr>
                                  <tr>
                                    <td align="left" valign="top" style="font-family:Arial, sans-serif; font-size:15px; color:#0f0f0f; font-weight:bold; line-height:18px; text-align:left;" mc:edit="peter_text">Peter N. Flint</td>
                                  </tr>

                                  <tr>
                                    <td height="18" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                </table>
                                <table width="180" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top">
                                      <table width="180" border="0" align="center" cellpadding="0" cellspacing="0">
                                        <tr>
                                          <td width="26" align="left" valign="top">
                                            <a href="http://www.facebook.com/*" target="_blank">
                                              <img mc:edit="fb" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d93affec-486e-4020-aa6e-7aa2d320cc6d.jpg" width="26" height="26" alt="Facebook" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://twitter.com/DirectSites" target="_blank">
                                              <img mc:edit="tweet" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/30d7dafd-8973-4bd4-a174-d7ad09a1f48c.jpg" width="26" height="26" alt="Twitter" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a target="_blank">
                                              <img mc:edit="sky" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/ae3d2cb4-9d8e-477a-9407-ad1f58ab0e22.jpg" width="26" height="26" alt="Skype" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="4"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://plus.google.com/100692187112615457693/posts" target="_blank">
                                              <img mc:edit="google" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/bd2d9723-43f8-43c4-bd53-c018a047c4b5.jpg" width="26" height="26" alt="Google Plus" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="http://www.linkedin.com/company/direct-sites-online" target="_blank">
                                              <img mc:edit="linked" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/d6c04a93-f07a-4d41-83a8-29471d1e62fe.jpg" width="26" height="26" alt="Linkedin" border="0" style="display:block;">
                                            </a>
                                          </td>
                                          <td width="5"></td>
                                          <td width="26" align="left" valign="top">
                                            <a href="https://www.youtube.com/user/*" target="_blank">
                                              <img mc:edit="you" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/511a6d1b-f46d-4fdd-9612-4fd5ccad8220.jpg" width="26" height="26" alt="You Tube" border="0" style="display:block;">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                  <tr>
                                    <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                  </tr>
                                  <tr>
                                    <td align="right" valign="top">
                                      <table width="113" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td align="center" valign="top">
                                            <a href="http://www.*.com.au" target="_blank">
                                              <img mc:edit="**" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/1bb167db-01ff-4cda-aaf4-b30dc1d14605.jpg" width="113" height="19" alt="Direct Sites Online">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                  </td>
                  <td width="35" class="spacer"></td>
                </tr>
                <tr>
                  <td></td>
                  <td height="32"></td>
                  <td></td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td align="left" valign="top">
              <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table" mc:repeatable="">
                <tr>
                  <td align="left" valign="top">
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td align="left" valign="top" bgcolor="#f06122">
                          <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                            <tr>
                              <td></td>
                              <td height="26"></td>
                              <td></td>
                            </tr>
                            <tr>
                              <td width="35" class="spacer"></td>
                              <td align="left" valign="top" class="**_txt" style="font-family:Arial, sans-serif; font-size:23px; color:#ffffff; line-height:normal; text-align:center;" mc:edit="**_news"><span style="font-weight:bold;">**</span> News and <span style="font-weight:bold;">BLOG</span> articles</td>
                              <td width="25" class="spacer"></td>
                            </tr>
                            <tr>
                              <td></td>
                              <td height="26"></td>
                              <td></td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      <tr>
                        <td height="30"></td>
                      </tr>
                    </table>
                  </td>
                </tr>
                <tr>
                  <td align="left" valign="top">
                    <table width="650" border="0" align="center" cellpadding="0" cellspacing="0" class="main_table">
                      <tr>
                        <td width="35" class="spacer"></td>
                        <td align="left" valign="top">
                          <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                            <tr>
                              <td align="left" valign="top">
                                <table width="580" border="0" align="center" cellpadding="0" cellspacing="0" class="wrapper">
                                  <tr>
                                    <td align="left" valign="top">
                                      <table width="219" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td height="5" style="line-height:0px; font-size:0px;" class="hide">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top" class="pad_btm">
                                            <a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank">
                                              <img mc:edit="consider" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/c4a9748a-32b7-4500-97a6-a67b42c76030.png" width="219" height="146" alt="Tis the season for email marketing" border="0"
                                              style="display:block;">
                                            </a>
                                          </td>
                                        </tr>
                                      </table>
                                      <table width="340" border="0" align="right" cellpadding="0" cellspacing="0" class="wrapper">
                                        <tr>
                                          <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:18px; color:#f06022; line-height:normal; text-align:left;" mc:edit="website_text">Start incorporating local seo in the success strategy for your business</td>
                                        </tr>
                                        <tr>
                                          <td height="10" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="left" valign="top" class="txt_dvd" style="font-family:Arial, sans-serif; font-size:13px; color:#0f0f0f; line-height:18px; text-align:left;" mc:edit="building_text">You have probably heard about SEO (stands for Search Engine Optimisation), but how about local SEO? Do you know the difference between the two? Well, one thing is for sure, and that is that SEO optimizes the content
                                            of your website according to the requirements of search engines so that they will appear in search result inquiries.
                                            <br class="hide">
                                            <a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff;"><span style="color:#5e5e5e; line-height:18px;">Continue Here - Read more of this article which is located on our blog.</span></a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td height="22" style="line-height:0px; font-size:0px;">&nbsp;</td>
                                        </tr>
                                        <tr>
                                          <td align="left" valign="top">
                                            <table width="132" border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
                                              <tr>
                                                <td align="left" valign="top">
                                                  <table width="132" border="0" align="center" cellpadding="0" cellspacing="0">
                                                    <tr>
                                                      <td width="8" align="left" valign="top">
                                                        <img mc:edit="curve" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/18ca4c30-13b9-46c8-94eb-2f763c7cd6f3.png" width="8" height="35" alt="" border="0" style="display:block;">
                                                      </td>
                                                      <td align="center" valign="middle" bgcolor="#000000" class="read_more" style="font-family:Arial, sans-serif; background-color:#000000; font-size:14px; color:#ffffff; line-height:18px; text-align:center;" mc:edit="more_text"><a href="http://www.*.com/start-incorporating-local-seo-in-the-success-strategy-for-your-business/" target="_blank" style="text-decoration:none; color:#ffffff; display:block;">Read More</a>
                                                      </td>
                                                      <td width="8" align="left" valign="top">
                                                        <img mc:edit="curve1" src="https://gallery.mailchimp.com/44b112d6bdab5acf586d2cea8/images/b06c0f3e-b1af-4af8-b110-da2c5cf37e47.png" width="8" height="35" alt="" border="0" style="display:block;">
                                                      </td>
                                                    </tr>
                                                  </table>
                                                </td>
                                              </tr>
                                            </table>
                                          </td>
                                        </tr>
                                      </table>
                                    </td>
                                  </tr>
                                </table>
                              </td>
                            </tr>