如何优化Mailchimp的电子邮件通讯

时间:2014-05-13 15:19:54

标签: mailchimp

我正在为Mailchimp创建一个功能性的时事通讯设计。但我无法让它发挥作用。我的客户说您的编码设计不正确。我把所有代码放在这里。如果设计有任何问题,请告诉我。如果有问题我该如何解决这个问题?

谢谢。

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

            <!-- Facebook sharing information tags -->
            <meta property="og:title" content="*|MC:SUBJECT|*" />

            <title>*|MC:SUBJECT|*</title>

            <style type="text/css">
    * {margin: 0;padding: 0;}
    body {font-family: arial;font-weight: normal;font-size: 13px;text-decoration: none;line-height: 20px;background: #282828;}
    h1 {margin-bottom: 20px;}
    a {text-decoration: none;}
    a > img{border: 0;}

    .wrapper {width: 600px;margin: 0 auto;display: block;overflow: hidden;background: #fff;max-width: 600px;}
    .post-header {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/00a70c8b-3f26-4443-be0d-3248b62d25aa.jpg);padding: 25px 46px;height: 98px;}
    .post-header img {float: left;}
    #header-text-year {float: right;margin-top: 26px;line-height: 30px;}
    .post-welcome {height: 435px;}
    .sub-text {padding: 20px 40px;}
    .sub-text p {text-align: left;color: #5E5E5E;margin-bottom: 20px;}
    #orange-text {margin-top: 33px;}
    #orange-text p {line-height: 4px;}
    #color-text {color: #EB6A06;font-weight: bold;}
    #normal-header-text {font-weight: bold;color: #5E5E5E;}
    .post-bgbetter {width: 600px;background: #fff;}
    .post-theclub {width: 600px;height: 475px;}
    .mail-con {padding: 300px;}
    .post-facelift-area {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/5252fd1f-b1e1-4cb1-8c40-ba0cbfea50b3.png);background-repeat: no-repeat;height: 460px;width: 600px;margin-top: -20px;}
    #facelift-text {padding-top: 230px;float: right;}
    #facelift-text img {padding: 0px 0px 0px 281px;margin-top: 25px}
    .no-space-text {}

    #facelift-text p {text-align: right;margin: 20px 40px;color: #fff;}
    .post-privacy {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/9954354f-c5c5-4a2b-ac7d-cf4ce110be7d.jpg);background-repeat: no-repeat;width: 600px;}
    .post-privacy-area {text-align: left;padding: 20px 39px;}
    .post-privacy-area img {margin: 26px 0 14px;}
    .post-privacy-area p {margin-bottom: 20px;color: #fff;}
    .post-bgbetter-text {padding: 0px 39px 20px;}
    .post-bgbetter-area img {padding: 25px 64px 0px;}
    .post-bgbetter-text img {float: right;margin: -20px 0 15px;padding: 0 0 0 318px;}
    .post-bgbetter-text p {text-align: right;margin-bottom: 20px;color: #5E5E5E;}
    .post-gear-area {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/41772609-fdb1-4a6a-85ea-06e7827a18ae.jpg);background-repeat: no-repeat;height: 460px;width: 600px;}
    .post-gear-area img {padding: 3px 50px;}
    .post-gear-text {text-align: left;padding: 0px 39px;margin-top: -27px;}
    .post-gear-text img {margin: -11px 0 15px;padding: 0;}
    .post-gear-text p {color: #fff;margin-bottom: 15px;}
    #no-height {margin-bottom: 15px;}
    .post-radio {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/845ff328-f351-499e-ac27-bb58d49f8f90.jpg);background-repeat: no-repeat;height: 460px;width: 600px;}
    .post-radio-area {padding: 0px 39px;text-align: right;}
    .post-radio-area img {padding: 30px 109px 0;}
    .post-radio-text img {padding: 0px;margin-bottom: 8px;}
    .post-radio-area p {color: #fff;margin-bottom: 20px;}
    .post-theclub-text {padding: 0px 39px;margin-top: -25px;}
    .post-radio-text {}
    .post-theclub-area {text-align: left;}
    .post-theclub {background: #FFFFFF;}
    .post-theclub-text img {margin-bottom: 15px;padding: 0;}
    .post-theclub-text p {margin-bottom: 20px;color: #5E5E5E;}
    .post-idea {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/7fc74dec-8fd4-4d10-b2ca-ddb0a79074ec.jpg);height: 460px;background-repeat: no-repeat;width: 600px;}
    .post-idea-text {text-align: right;padding: 266px 39px;}
    .post-idea-text img {padding: 0px;margin-bottom: 15px;}
    .post-idea-text p {margin-bottom: 20px;color: #fff;}
    .post-footer {background-image: url(http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/c15c494c-434a-4e0a-b12f-113a7613738d.jpg);background-repeat: no-repeat;height: 229px;width: 600px;}
    .post-footer-area {text-align: -moz-left;padding: 40px 39px;}
    .post-footer-area h3 {font-weight: bold;font-size: 19px;color: #fff;}
    .post-footer-area p {font-size: 16px;color: #fff;}
    .contact-area {width: 312px;margin-top: 10px;display: inline-block;}
    .contact-area img {display: inline;}
    .contact-area p {font-size: 13px;}
    .post-footer-section {display: inline-block;}
    #seperator {margin-bottom: 3px;}
    .mobile-icon {width: 280px;}
    .mobile-icon img {float: left;margin-top: 2px;}
    .mobile-icon p {margin-left: 25px;}
    .contact-icon {width: 280px;}
    .contact-icon img {float: left;margin-top: 7px;}
    .contact-icon p {margin-left: 25px;}
    .phone-icon {width: 280px;}
    .phone-icon img {float: left;margin-top: 2px;}
    .phone-icon p {margin-left: 25px;}
    .fax-icon {width: 280px;}
    .fax-icon img {float: left;margin-top: 5px;}
    .fax-icon p {margin-left: 25px;}
    .location-icon {width: 280px;}
    .location-icon img {float: left;margin-top: 2px;}
    .location-icon p {margin-left: 25px;}
    .post-footer-area {text-align: left;}
    .footer-logo-area {width: 160px;float: right;margin: 73px 0 0 41px;display: inline-block;}

    /* media queries for Chrome 33.0+ */
    @media screen and (-webkit-min-device-pixel-ratio:0) { 
        .footer-logo-area {width: 160px;float: right;margin: -52px 0 0 41px;display: inline-block;}
    }

    @media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1024px) {
        .footer-logo-area {width: 160px;float: right;margin: -52px 0 0 41px;display: inline-block;}
    }​

            </style>
        </head>
        <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
            <center>
                <table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
                    <tr>
                        <td align="center" valign="top">
                            <div class="wrapper">
                                <div class="post-header">
                                    <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/2272c8a4-a689-4558-bae2-09487fb399ec.png" alt=""></a>
                                    <div id="header-text-year">
                                        <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/f8179d63-f496-4263-9cd5-f8e1d8ee9be0.png" alt=""></a>
                                    </div>
                                </div>
                                <div class="post-welcome">
                                    <div class="sub-text">
                                        <a href="#">
                                        <p>Hi all,</p>
                                        <p>Welcome to the first monthly marketing newsletter. This publication is intended as an information resource, and will feature new marketing content for your offices as it is developed. I'll also cover the marketing activity we have in place for the brand, what local area marketing the other Go Gecko franchises are putting in place, and more.</p>
                                        <p>Whilst I've had the pleasure of meeting most of you, there are still a few offices I'm yet to visit. This will take place over the coming weeks as your schedules permit.</p>
                                        <p>In the meantime, if any of you have stories, or new, successful marketing ideas to share in the next issue - please do so. You can reach me by emailing brent.christensen@gogecko.com.au.</p>
                                        <a href="#">
                                        <div id="orange-text">
                                            <a href="#"><p id="color-text">Brent Christensen</p></a>
                                            <a href="#"><p id="normal-header-text">Marketing Coordinator</p></a>
                                            <a href="#"><p id="normal-header-text">Go Gecko National Support Office</p></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-facelift">
                                    <div class="post-facelift-area">
                                        <div id="facelift-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/35d2c610-5ef9-4dbb-a387-0293a14a94a9.png" alt=""></a>
                                            <a href="#"><p>I'm excited to announce a refresh of our website's <b><i>Home</i></b> and <b><i>Office</i></b> pages. In the coming months we'll be rolling out a new home page for the Go Gecko website, followed by a refreshed page for each Franchise (details and designs being released soon). The new design is more user-friendly, contains modern finishes and was designed for easier navigation on desktops and tablets alike. Still in its preliminary stages, the new page designs will go live over the next few months.</p></a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-privacy">
                                    <div class="post-privacy-area">
                                        <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/2ea22b0c-4394-429f-ae61-b6b053b7db08.png" alt=""></a>
                                        <a href="#">
                                            <p>Mike and I recently attended a seminar covering some of the amendments to the privacy act, which came into effect in March. This outlined the way we handle vendor and buyer information. Some things to keep in mind are:</p>
                                            <p>1. Always keep OFI forms with personal information somewhere safe, never left on tables.</p>
                                            <p>2. If details on a form will be used for marketing, we need to outline this somewhere (small) on the document. Contact us here at head office if you would like more info.</p>
                                            <p>3. It was recommended that a copy of the privacy policy be readily available at OFIs. We recommend placing a laminated copy on a table within the home during such time. We will be posting out copies of these to each office in the coming weeks.</p>
                                            <p>4. Sign in / out books. If you have a book used for signing keys in and out, this is a potential breach if left out in the open. We recommend using a separate page for each sign in / out to prevent those signing in, from seeing the previous person's information.</p>
                                        </a>
                                    </div>
                                </div>
                                <div class="post-bgbetter">
                                    <div class="post-bgbetter-area">
                                        <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/bd5dc66d-f0d5-4975-96f8-cae14c68c13a.png" alt=""></a>
                                        <div class="post-bgbetter-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/8e695941-9323-4968-9d61-e38e616078b0.png" alt=""></a>
                                            <a href="#">
                                                <p>As some of you have seen first hand, I have access to highly discounted, trade-rate printing with a fast turn around. On a weekly basis some offices print thousands of flyers and brochures. If we order together as a network, we can reduce our print bills even further.</p>
                                                <p>Please keep me updated on any print orders you plan on placing, as I can coordinate a bulk order and save everyone money.</p>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-gear">
                                    <div class="post-gear-area">
                                        <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/3a101e17-bbb5-4828-a94e-adf213a488af.png" alt=""></a>
                                        <div class="post-gear-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/3ff624ed-4af7-49ef-a4d4-ea37b44ce88d.png" alt=""></a>
                                            <a href="#">
                                                <p>We have a number of branded promotional items available for hire or purchase. If you have any upcoming events or promotions, please feel free to request these.</p>

                                                <p id="no-height">FREE TO HIRE: Branded marquee, Go Gecko mascot suit, Teardrop flags + Temp. tattoos
                                                AVAILABLE FOR PURCHASE: Pens, Balloons, Keyrings (bottle opener), Caps + more</p>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-radio">
                                    <div class="post-radio-area">
                                        <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/9be804cd-a3d1-474a-9488-d9fe49b05108.png" alt=""></a>
                                        <div class="post-radio-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/fb58f10d-2502-4566-945a-2797619aa50d.png" alt=""></a>
                                            <a href="#">
                                                <p>For the months of March and April we ran 2 radio campaigns across B105 and 97.3.</p>
                                                <p>The campaigns cost us just $15,159 combined, but due to purchasing these both at distressed rates we received more than $55,000 in spots!</p>
                                                <p>We will continue to purchase radio spots as they become available at distressed rates.</p>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-theclub">
                                    <div class="post-theclub-area">
                                        <div class="post-theclub-fix">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/b547c599-2a61-4b9c-b0bd-59688a1cb0c6.jpg" alt=""></a>
                                        </div>
                                        <div class="post-theclub-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/d9ecf5e8-42c4-447d-b77b-551f8f36d366.png" alt=""></a>
                                            <a href="#">
                                                <p>There may be some outside the network who think it isn't possible to earn 6 figures with Go Gecko, and our capped commission structure -- they couldn't be further from the truth.</p>
                                                <p>Each month I'll feature an agent in this newsletter whose salary is over $100,000 as a result of their hard work and dedication. If you would like to nominate one of your staff, please do so by emailing brent.christensen@gogecko.com.au.</p>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-idea">
                                    <div class="post-idea-area">
                                        <div class="post-idea-text">
                                            <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/a33033d3-500e-4cc5-aba1-5645c3e009f8.png" alt=""></a>
                                            <a href="#">
                                                <p>For those who are using ideas@gogecko.com.au - thanks. We compile these creative concepts so we can improve our existing practices and put them to use later in the year.</p>

                                                <p>From now until the end of May 2014, the most innovative idea submitted
                                                will WIN 10,000 flyers, printed and distributed throughout their territory</p>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="post-footer">
                                    <div class="post-footer-area">
                                        <a href="#"><h3>Brent Christensen</h3></a>
                                        <a href="#"><p>Marketing Coordinator</p></a>
                                        <div class="post-footer-section">
                                            <div class="contact-area">
                                                <div id="seperator" class="mobile-icon">
                                                    <a href="">
                                                        <img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/944a22a9-87ab-4a64-b701-85f08a235bcc.png" alt="">
                                                        <p>0475 071 621</p>
                                                    </a>
                                                </div>
                                                <div id="seperator" class="contact-icon">
                                                    <a href="">
                                                        <img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/b55a4a33-7270-43fa-b800-eab55b130d5c.png" alt="">
                                                        <p>brent.christensen@gogecko.com.au</p>
                                                    </a>
                                                </div>
                                                <div id="seperator" class="phone-icon">
                                                    <a href="">
                                                        <img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/8358e0d2-3898-4397-a621-f27b87763218.png" alt="">
                                                        <p>(07) 3633 6900</p>
                                                    </a>
                                                </div>
                                                <div id="seperator" class="fax-icon">
                                                    <a href="">
                                                        <img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/a37a5302-de7f-477a-8ea7-cbff57b83c81.png" alt="">
                                                        <p>(07) 3630 1868</p>
                                                    </a>
                                                </div>
                                                <div id="seperator" class="location-icon">
                                                    <a href="">
                                                        <img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/99ed8166-b1b7-4906-8ac2-bd8327643d91.png" alt="">
                                                        <p>2/34 Navigator Place, Hendra QLD 4011</p>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="footer-logo-area">
                                                <a href="#"><img src="http://gallery.mailchimp.com/a6bc420f56fff9e43f7c79440/images/48efbad6-5144-45b7-83c6-3e3619dcb038.png" alt=""></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                </table>
            </center>
        </body>
    </html>

1 个答案:

答案 0 :(得分:-1)

所有样式都应该作为内联样式放到HTML元素中。如果不这样做,大多数电子邮件客户端都会跳过内容并显示没有样式的电子邮件。