使用Aweber在Wordpress中的HTML问题

时间:2011-08-18 09:42:08

标签: html css wordpress aweber

我在Wordpress中设置我的网站,我有一个非常讨厌的问题。

我有一个很棒的站点栏和一些小部件。当我没有实现我的时事通讯盒(这是一个Aweber脚本 - 见下文)时,它看起来很棒。但是,当我实现它时,似乎HTML出错了。

但是,当我将简报框放在最小的小部件中时,它看起来也很棒。问题是,我需要将通讯放得更高,以便获得更多潜在客户。

图形示例:

当简讯箱位于底部时(一切看起来都很棒): http://i52.tinypic.com/2w6gb3c.jpg

当简报箱出现在那里时(并且一切看起来都很糟糕):http://i56.tinypic.com/no6ntd.jpg

因此,我的问题是:我是如何解决这个问题的呢?我尝试修复HTML列表,它似乎不是一个缺少结束标记..而且HTML似乎有效

技术信息

Aweber脚本是:

<script type="text/javascript" src="http://forms.aweber.com/form/42/XXX.js"></script>

这是指HTML表单,如下所示:

<!-- AWeber Web Form Generator 3.0 -->
<style type="text/css">
#af-form-1560005742 .af-body .af-textWrap{width:98%;display:block;float:none;}
#af-form-1560005742 .af-body a{color:#700909;text-decoration:underline;font-style:normal;font-weight:normal;}
#af-form-1560005742 .af-body input.text, #af-form-1560005742 .af-body textarea{background-color:#FFFFFF;border-color:#BD965A;border-width:1px;border-style:solid;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .af-body input.text:focus, #af-form-1560005742 .af-body textarea:focus{background-color:#FFFAD6;border-color:#030303;border-width:1px;border-style:solid;}
#af-form-1560005742 .af-body label.previewLabel{display:block;float:none;text-align:left;width:auto;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .af-body{padding-bottom:15px;padding-top:15px;background-repeat:repeat-y;background-position:center left;background-image:url("http://forms.aweber.com/images/forms/memo/khaki/body.png");color:#000000;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .af-footer{padding-bottom:45px;padding-top:1px;padding-right:34px;padding-left:34px;background-color:transparent;background-repeat:no-repeat;background-position:bottom left;background-image:url("http://forms.aweber.com/images/forms/memo/khaki/footer.png");border-width:1px;border-bottom-style:none;border-left-style:none;border-right-style:none;border-top-style:none;color:#000000;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .af-header{padding-bottom:1px;padding-top:20px;padding-right:34px;padding-left:34px;background-color:transparent;background-repeat:no-repeat;background-position:top left;background-image:url("http://forms.aweber.com/images/forms/memo/khaki/header.png");border-width:1px;border-bottom-style:none;border-left-style:none;border-right-style:none;border-top-style:none;color:#8A1F0A;font-size:16px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .af-quirksMode .bodyText{padding-top:2px;padding-bottom:2px;}
#af-form-1560005742 .af-quirksMode{padding-right:32px;padding-left:34px;}
#af-form-1560005742 .af-standards .af-element{padding-right:32px;padding-left:34px;}
#af-form-1560005742 .bodyText p{margin:1em 0;}
#af-form-1560005742 .buttonContainer input.submit{background-image:url("http://forms.aweber.com/images/auto/gradient/button/900.png");background-position:top left;background-repeat:repeat-x;background-color:#790000;border:1px solid #790000;color:#FFFFFF;text-decoration:none;font-style:normal;font-weight:normal;font-size:14px;font-family:Verdana, sans-serif;}
#af-form-1560005742 .buttonContainer input.submit{width:auto;}
#af-form-1560005742 .buttonContainer{text-align:left;}
#af-form-1560005742 body,#af-form-1560005742 dl,#af-form-1560005742 dt,#af-form-1560005742 dd,#af-form-1560005742 h1,#af-form-1560005742 h2,#af-form-1560005742 h3,#af-form-1560005742 h4,#af-form-1560005742 h5,#af-form-1560005742 h6,#af-form-1560005742 pre,#af-form-1560005742 code,#af-form-1560005742 fieldset,#af-form-1560005742 legend,#af-form-1560005742 blockquote,#af-form-1560005742 th,#af-form-1560005742 td{float:none;color:inherit;position:static;margin:0;padding:0;}
#af-form-1560005742 button,#af-form-1560005742 input,#af-form-1560005742 submit,#af-form-1560005742 textarea,#af-form-1560005742 select,#af-form-1560005742 label,#af-form-1560005742 optgroup,#af-form-1560005742 option{float:none;position:static;margin:0;}
#af-form-1560005742 div{margin:0;}
#af-form-1560005742 fieldset{border:0;}
#af-form-1560005742 form,#af-form-1560005742 textarea,.af-form-wrapper,.af-form-close-button,#af-form-1560005742 img{float:none;color:inherit;position:static;background-color:none;border:none;margin:0;padding:0;}
#af-form-1560005742 input,#af-form-1560005742 button,#af-form-1560005742 textarea,#af-form-1560005742 select{font-size:100%;}
#af-form-1560005742 p{color:inherit;}
#af-form-1560005742 select,#af-form-1560005742 label,#af-form-1560005742 optgroup,#af-form-1560005742 option{padding:0;}
#af-form-1560005742 table{border-collapse:collapse;border-spacing:0;}
#af-form-1560005742 ul,#af-form-1560005742 ol{list-style-image:none;list-style-position:outside;list-style-type:disc;padding-left:40px;}
#af-form-1560005742,#af-form-1560005742 .quirksMode{width:275px;}
#af-form-1560005742.af-quirksMode{overflow-x:hidden;}
#af-form-1560005742{background-color:transparent;border-color:transparent;border-width:1px;border-style:none;}
#af-form-1560005742{overflow:hidden;}
.af-body .af-textWrap{text-align:left;}
.af-body input.image{border:none!important;}
.af-body input.submit,.af-body input.image,.af-form .af-element input.button{float:none!important;}
.af-body input.text{width:100%;float:none;padding:2px!important;}
.af-body.af-standards input.submit{padding:4px 12px;}
.af-clear{clear:both;}
.af-element label{text-align:left;display:block;float:left;}
.af-element{padding:5px 0;}
.af-form-wrapper{text-indent:0;}
.af-form{text-align:left;margin:auto;}
.af-header,.af-footer{margin-bottom:0;margin-top:0;padding:10px;}
.af-quirksMode .af-element{padding-left:0!important;padding-right:0!important;}
.lbl-right .af-element label{text-align:right;}
body {
}
</style>
<form method="post" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl" target="_new" >
<div style="display: none;">
<input type="hidden" name="meta_web_form_id" value="XXX" />
<input type="hidden" name="meta_split_id" value="" />
<input type="hidden" name="listname" value="youfirmnet" />
<input type="hidden" name="redirect" value="http://www.youfirm.net/wait-you-are-not-done-yet/" id="XXX" />

<input type="hidden" name="meta_adtracking" value="XXXX" />
<input type="hidden" name="meta_message" value="1" />
<input type="hidden" name="meta_required" value="email" />

<input type="hidden" name="meta_tooltip" value="" />
</div>
<div id="af-form-1560005742" class="af-form"><div id="af-header-XXX" class="af-header"><div class="bodyText"><p><span class="Apple-style-span" style="font-size: 18px;"><strong>Quality Newsletter:</strong></span></p>
<p><span class="Apple-style-span" style="font-size: 13px;">I write when I've something <em>important to share</em>. <strong>No</strong> daily emails and <strong>no</strong> spam.&nbsp;</span><span class="Apple-style-span" style="font-size: 13px;"><strong>By signing up</strong>, you will receive my *MUST READ* e-book: How the world of business is changing.</span></p></div></div>
<div id="af-body-XXX" class="af-body af-standards">
<div class="af-element">
<label class="previewLabel" for="awf_field-23759938">Email: </label>
<div class="af-textWrap"><input class="text" id="awf_field-XX" type="text" name="email" value="" tabindex="500"  />
</div><div class="af-clear"></div>
</div>
<div class="af-element buttonContainer">
<input name="submit" class="submit" type="submit" value="Submit" tabindex="501" />
<div class="af-clear"></div>
</div>
</div>
<div id="af-footer-XX" class="af-footer"><div class="bodyText"><p>&nbsp;</p></div></div>
</div>
<div style="display: none;"><img src="http://forms.aweber.com/form/displays.htm?id=jKxsDAwMrOwsTA==" alt="" /></div>
</form>
<script type="text/javascript">
    <!--
    (function() {
        var IE = /*@cc_on!@*/false;
        if (!IE) { return; }
        if (document.compatMode && document.compatMode == 'BackCompat') {
            if (document.getElementById("af-form-X")) {
                document.getElementById("af-form-XX").className = 'af-form af-quirksMode';
            }
            if (document.getElementById("af-body-x")) {
                document.getElementById("af-body-x").className = "af-body inline af-quirksMode";
            }
            if (document.getElementById("af-header-x")) {
                document.getElementById("af-header-x").className = "af-header af-quirksMode";
            }
            if (document.getElementById("af-footer-x")) {
                document.getElementById("af-footer-X").className = "af-footer af-quirksMode";
            }
        }
    })();
    -->
</script>

<!-- /AWeber Web Form Generator 3.0 -->

UGLY版本的HTML:

<div class="sidebar_widgets">

            <ul>

            <li id="categories-3" class="widget widget_categories"><h2 class="widgettitle">Blog Categories</h2><div class="widget_inner">       <ul> 
    <li class="cat-item cat-item-4"><a href="http://www.youfirm.net/category/cro/" title="When you have used either resources or money to attract visitors, you need to make money of these visitors. This category is all about how to convert the visitors into buyers.">Conversion Rate Optimization</a> (5)
</li> 
    <li class="cat-item cat-item-12"><a href="http://www.youfirm.net/category/experiments/" title="In this category a variety of experiments I&#039;ve performed myself is shown.">Experiments</a> (1)
</li> 
    <li class="cat-item cat-item-11"><a href="http://www.youfirm.net/category/business/" title="This category covers some general advice and ideas. There are loads of different ideas you can use in your business - no matter what you are doing.">General Advice</a> (7)
</li> 
    <li class="cat-item cat-item-5"><a href="http://www.youfirm.net/category/gettingvisitors/" title="Getting a large amount of visitors is essential to any business - offline and online. In this category I cover new ideas and methods to get visitors. If you are looking for search engine optimization help, look under YouFirm Articles.">Getting Visitors</a> (5)
</li> 
    <li class="cat-item cat-item-9"><a href="http://www.youfirm.net/category/question-and-answers/" title="When people ask me questions using the Free advice page, I answer those questions. In this category you will see the questions asked and my answers to them.">Question and Answers</a> (7)
</li> 
    <li class="cat-item cat-item-3"><a href="http://www.youfirm.net/category/upsell/" title="To make more money, up-selling is very important. Getting customers will often be expensive, so when you have customers, it is essential you make money up-selling them. This is what makes the difference: Get customers to buy again and get them to buy more.">Upselling</a> (3)
</li> 
    <li class="cat-item cat-item-8"><a href="http://www.youfirm.net/category/website-feedback/" title="When people ask me about website feedback using the Free advice page, I tend to give some feedback! Here is some of the feedback posted.">Website Feedback</a> (2)
</li> 
        </ul> 
</div></li><li id="text-4" class="widget widget_text">          <div class="textwidget"><script type="text/javascript" src="http://forms.aweber.com/form/42/1560005742.js"></script></div> 
        </div></li><li id="text-9" class="widget widget_text"><h2 class="widgettitle">YouFirm Membership</h2><div class="widget_inner">         <div class="textwidget"><b>This is the best I can offer</b>. This is my premium membership program which offers "how to" information. It covers how to get massive traffic, high conversions and generate massive up-sell.<br/><br/>

<a href="http://www.YouFirm.net/university" onclick="javascript:_gaq.push(['_trackEvent','outbound-widget','http://www.YouFirm.net']);" style="color:#9d080d; text-decoration: underline; font-weight:bold;">Read more about YouFirm University here</a>.</div> 
        </div></li>     <li id="recent-posts-3" class="widget widget_recent_entries">       <h2 class="widgettitle">Recent Posts</h2><div class="widget_inner">     <ul> 
                <li><a href="http://www.youfirm.net/2011/08/is-social-media-really-for-anyone/" title="Is social media really for anyone?">Is social media really for anyone?</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/buying-visitors-from-fiverr/" title="Buying visitors from Fiverr">Buying visitors from Fiverr</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/do-the-unexpected/" title="Do the Unexpected">Do the Unexpected</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/qr-codes-and-their-potential-exciting-designs/" title="QR Codes and their potential &#8211; Exciting designs">QR Codes and their potential &#8211; Exciting designs</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/using-professional-newsletter-managers/" title="Using Professional Newsletter Managers">Using Professional Newsletter Managers</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/q-is-it-easy-to-outrank-wikipedia-amazon-and-alike-in-google/" title="Q: Is it easy to outrank Wikipedia, Amazon and alike in Google?">Q: Is it easy to outrank Wikipedia, Amazon and alike in Google?</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/310/" title="More and More Elderly People">More and More Elderly People</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/getting-started-with-linkbuilding/" title="Getting started with linkbuilding">Getting started with linkbuilding</a></li> 
                <li><a href="http://www.youfirm.net/2011/08/what-are-personas-and-how-to-use-them/" title="What Are Personas and How to Use Them">What Are Personas and How to Use Them</a></li> 
                </ul> 
        </div></li><li id="text-8" class="widget widget_text"><h2 class="widgettitle">Who is behind YouFirm?</h2><div class="widget_inner">         <div class="textwidget">My name is Lars Holdgaard and I am a full time entrepreneur. Read all <a href="http://www.youfirm.net/about/"  style="color:#9d080d; text-decoration: underline; font-weight:bold;">about me here</a>.<br/><br/>

<img src="http://i51.tinypic.com/24pe6gl.jpg" alt="Lars Holdgaard" title="Lars Holdgaard" width="150px" /></div> 
        </div></li>         </ul>

        </div>

    </div>



    </div>

完整的CSS: http://www.youfirm.net/wp-content/themes/SereneLiteTheme/style.css

1 个答案:

答案 0 :(得分:0)

我正在以正确的方式发布解决方案。所以你可以接受它,如果它对你来说很好。

<li id="text-4" class="widget widget_text">
  <div class="textwidget"><script type="text/javascript" src="http://forms.aweber.com/form/42/1560005742.js"></script></div>
  </div>
</li>

问题在于结束</div>标记,它位于ID为'text-4'的<li>标记内。因此,您可以快速找到具有该ID的元素,并从中删除最后一个结束div标记。

所以它看起来像这样:

<li id="text-4" class="widget widget_text">
  <div class="textwidget"><script type="text/javascript" src="http://forms.aweber.com/form/42/1560005742.js"></script></div>
</li>

此外,我们建议您使用http://validator.w3.org/在页面中查找更多错误。