optin box design confounds aweber code insertion
I have an optin template which is preset and I want to know how to insert the aweber form codes into it without changing the original appearance of the optin area.
Below is the text from the template optin area and further below is the text from Aweber.
Thanks Marie
**************
<form action="#" method="post">
<tr><td style="background-image:url(images/squeeze-video_425x344_r2_c4.jpg); width:348px; height:133px; background-repeat:no-repeat" valign="top">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="340">
<tr><td style="height:10px; "></td></tr>
<tr><td><p align="center" class="tahoma_20"><b><font color="#FFFF00" size="5" face="Tahoma">..Get The
Inside Scoop On How A Rookie Made $100,000+ in the Promotions Industy.."</font></b></p></td></tr>
</table>
</td></tr>
<tr><td><img src="images/squeeze-video_425x344_r4_c4.jpg" width="348" height="93" border="0" alt="" /></td></tr>
<tr><td><img src="images/squeeze-video_425x344_r5_c4.jpg" width="348" height="57" border="0" alt="" /></td></tr>
<tr><td>
<table align="left" border="0" cellpadding="0" cellspacing="0" width="348">
<tr><td><img src="images/squeeze-video_425x344_r6_c4.jpg" width="130" height="34" border="0" alt="" /></td>
<td style="background-image:url(images/squeeze-video_425x344_r6_c7.jpg); width:180px; height:34px;"><input type="text" class="input_425x344" name="name" maxlength="30" value="" /></td>
<td><img src="images/squeeze-video_425x344_r6_c9.jpg" width="38" height="34" border="0" alt="" /></td>
</tr>
</table>
</td></tr>
<tr><td><img src="images/squeeze-video_425x344_r7_c4.jpg" width="348" height="10" border="0" alt="" /></td></tr>
<tr><td>
<table align="left" border="0" cellpadding="0" cellspacing="0" width="348">
<tr><td><img src="images/squeeze-video_425x344_r8_c4.jpg" width="129" height="31" border="0" alt="" /></td>
<td style="background-image:url(images/squeeze-video_425x344_r8_c6.jpg); width:181px; height:31px;"><input type="text" class="input_425x344" maxlength="120" name="email" value="" /></td>
<td><img src="images/squeeze-video_425x344_r8_c9.jpg" width="38" height="31" border="0" alt="" /></td>
</tr>
</table>
</td></tr>
<tr><td><img src="images/squeeze-video_425x344_r9_c4.jpg" width="348" height="13" border="0" alt="" /></td></tr>
<tr><td>
<table align="left" border="0" cellpadding="0" cellspacing="0" width="348">
<tr><td><img src="images/squeeze-video_425x344_r10_c4.jpg" width="73" height="50" border="0" alt="" /></td>
<td><img border="0" src="images/squeeze-video_425x344_r10_c.jpg" width="203" height="50"></td>
<td><img src="images/squeeze-video_425x344_r10_c8.jpg" width="72" height="50" border="0" alt="" /></td>
</tr>
</table>
</td></tr>
<tr><td><img src="images/squeeze-video_425x344_r12_c4.jpg" width="348" height="45" border="0" alt="" /></td></tr>
</form>
here is the aweber form code:
<!-- AWeber Web Form Generator 3.0 -->
<style type="text/css">
#af-form-1349078415 .af-body .af-textWrap{width:98%;display:block;float:none;}
#af-form-1349078415 .af-body input.text, #af-form-1349078415 .af-body textarea{background-color:#FFFFFF;border-color:#919191;border-width:1px;border-style:solid;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:10px;font-family:Verdana, sans-serif;}
#af-form-1349078415 .af-body input.text:focus, #af-form-1349078415 .af-body textarea:focus{background-color:#FFFAD6;border-color:#030303;border-width:1px;border-style:solid;}
#af-form-1349078415 .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:10px;font-family:Verdana, sans-serif;}
#af-form-1349078415 .af-body{padding-bottom:15px;padding-top:15px;background-repeat:no-repeat;background-position:inherit;background-image:none;color:#000000;font-size:10px;font-family:Verdana, sans-serif;}
#af-form-1349078415 .af-quirksMode{padding-right:15px;padding-left:15px;}
#af-form-1349078415 .af-standards .af-element{padding-right:15px;padding-left:15px;}
#af-form-1349078415 .buttonContainer input.submit{background-image:url("http://forms.aweber.com/images/auto/...button/ccc.png");background-position:top left;background-repeat:repeat-x;background-color:#acacac;border:1px solid #acacac;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:11px;font-family:Verdana, sans-serif;}
#af-form-1349078415 .buttonContainer input.submit{width:auto;}
#af-form-1349078415 .buttonContainer{text-align:left;}
#af-form-1349078415 button,#af-form-1349078415 input,#af-form-1349078415 submit,#af-form-1349078415 textarea,#af-form-1349078415 select,#af-form-1349078415 label,#af-form-1349078415 optgroup,#af-form-1349078415 option{float:none;position:static;margin:0;}
#af-form-1349078415 div{margin:0;}
#af-form-1349078415 form,#af-form-1349078415 textarea,.af-form-wrapper,.af-form-close-button,#af-form-1349078415 img{float:none;color:inherit;position:static;backg round-color:none;border:none;margin:0;padding:0;}
#af-form-1349078415 input,#af-form-1349078415 button,#af-form-1349078415 textarea,#af-form-1349078415 select{font-size:100%;}
#af-form-1349078415 select,#af-form-1349078415 label,#af-form-1349078415 optgroup,#af-form-1349078415 option{padding:0;}
#af-form-1349078415,#af-form-1349078415 .quirksMode{width:140px;}
#af-form-1349078415.af-quirksMode{overflow-x:hidden;}
#af-form-1349078415{background-color:#FFFFFF;border-color:transparent;border-width:1px;border-style:none;}
#af-form-1349078415{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!impor tant;}
.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-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="Email Newsletter AWeber Form" >
<div style="display: none;">
<input type="hidden" name="meta_web_form_id" value="1349078415" />
<input type="hidden" name="meta_split_id" value="" />
<input type="hidden" name="listname" value="promobranding" />
<input type="hidden" name="redirect" value="Important: Please Activate Your Subscription" id="redirect_034d800f0e5df141faa737155f6a5d33" />
<input type="hidden" name="meta_adtracking" value="promobranding" />
<input type="hidden" name="meta_message" value="1" />
<input type="hidden" name="meta_required" value="name,email" />
<input type="hidden" name="meta_forward_vars" value="" />
<input type="hidden" name="meta_tooltip" value="" />
</div>
<div id="af-form-1349078415" class="af-form"><div id="af-body-1349078415" class="af-body af-standards">
<div class="af-element">
<label class="previewLabel" for="awf_field-7760251">Name: </label>
<div class="af-textWrap">
<input id="awf_field-7760251" type="text" name="name" class="text" value="" tabindex="500" />
</div>
<div class="af-clear"></div></div>
<div class="af-element">
<label class="previewLabel" for="awf_field-7760252">Email: </label>
<div class="af-textWrap"><input class="text" id="awf_field-7760252" type="text" name="email" value="" tabindex="501" />
</div><div class="af-clear"></div>
</div>
<div class="af-element buttonContainer">
<input name="submit" class="submit" type="submit" value="Submit" tabindex="502" />
<div class="af-clear"></div>
</div>
</div>
</div>
<div style="display: none;"><img src="http://forms.aweber.com/form/display...wsnAzsHCyMrA==" 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-1349078415")) {
document.getElementById("af-form-1349078415").className = 'af-form af-quirksMode';
}
if (document.getElementById("af-body-1349078415")) {
document.getElementById("af-body-1349078415").className = "af-body inline af-quirksMode";
}
if (document.getElementById("af-header-1349078415")) {
document.getElementById("af-header-1349078415").className = "af-header af-quirksMode";
}
if (document.getElementById("af-footer-1349078415")) {
document.getElementById("af-footer-1349078415").className = "af-footer af-quirksMode";
}
}
})();
-->
</script>
<!-- /AWeber Web Form Generator 3.0 -->
Nic Penrake is a Senior Copywriter & Online marketing mentor. For free training plus unique method for massively building your list, click the link: http://budurl.com/7DayMQTraining