Are you referring to the opt-in box on the blog link?

What field are you trying to create? A drop down selection like the one in the budget?

If you click on next - you can see - he created a 3 step form. I am trying to learn how I can do it with aweber code

No- do not want to link 3 pages. I think there is a way to do it but can not seem to find the codes.

It can be achieved using some AJAX, however I don't think the website you linked to is doing it in a good way.

I'm using Chrome and the page is jumping up and down when I click on next, although it doesn't reload the entire page.

Just google for "ajax multi step form" and you'll find several clever ways (and better than the other site) of doing it

Thanks Manfred

I re-did the aweber form here

<!-- AWeber Web Form Generator 3.0 -->
<style type="text/css">
#af-form-187861448 .af-body .af-textWrap{width:98%;display:block;float:none;}
#af-form-187861448 .af-body .privacyPolicy{color:#000000;font-size:11px;font-family:Verdana, sans-serif;}
#af-form-187861448 .af-body a{color:#094C80;text-decoration:underline;font-style:normal;font-weight:normal;}
#af-form-187861448 .af-body input.text, #af-form-187861448 .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:12px;font-family:Verdana, sans-serif;}
#af-form-187861448 .af-body input.text:focus, #af-form-187861448 .af-body textarea:focus{background-color:#FFFAD6;border-color:#030303;border-width:1px;border-style:solid;}
#af-form-187861448 .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-187861448 .af-body{padding-bottom:15px;padding-top:15px;background-repeat:no-repeat;background-position:inherit;background-image:url("http://createyouronlinebiz.com/wp-co...family:Verdana, sans-serif;}
#af-form-187861448 .af-quirksMode{padding-right:15px;padding-left:15px;}
#af-form-187861448 .af-standards .af-element{padding-right:15px;padding-left:15px;}
#af-form-187861448 .buttonContainer input.submit{background-image:url("http://forms.aweber.com/images/auto/...d-position:top left;background-repeat:repeat-x;background-color:#bd7902;border:1px solid #bd7902;color:#FFFFFF;text-decoration:none;font-style:normal;font-weight:normal;font-size:14px;font-family:Verdana, sans-serif;}
#af-form-187861448 .buttonContainer input.submit{width:auto;}
#af-form-187861448 .buttonContainer{text-align:right;}
#af-form-187861448 button,#af-form-187861448 input,#af-form-187861448 submit,#af-form-187861448 textarea,#af-form-187861448 select,#af-form-187861448 label,#af-form-187861448 optgroup,#af-form-187861448 option{float:none;position:static;margin:0;}
#af-form-187861448 div{margin:0;}
#af-form-187861448 form,#af-form-187861448 textarea,.af-form-wrapper,.af-form-close-button,#af-form-187861448 img{float:none;color:inherit;position:static;backg round-color:none;border:none;margin:0;padding:0;}
#af-form-187861448 input,#af-form-187861448 button,#af-form-187861448 textarea,#af-form-187861448 select{font-size:100%;}
#af-form-187861448 select,#af-form-187861448 label,#af-form-187861448 optgroup,#af-form-187861448 option{padding:0;}
#af-form-187861448,#af-form-187861448 .quirksMode{width:284px;}
#af-form-187861448.af-quirksMode{overflow-x:hidden;}
#af-form-187861448{background-color:#F0F0F0;border-color:#CFCFCF;border-width:1px;border-style:solid;}
#af-form-187861448{display:block;}
#af-form-187861448{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="187861448" />
<input type="hidden" name="meta_split_id" value="" />
<input type="hidden" name="listname" value="freeseoconsult" />
<input type="hidden" name="redirect" value="Important: Please Activate Your Subscription" id="redirect_eeb1ee15fbf25c6216d31e654eaf4ee7" />
<input type="hidden" name="meta_adtracking" value="My_Web_Form_3" />
<input type="hidden" name="meta_message" value="1" />
<input type="hidden" name="meta_required" value="name,email" />
<input type="hidden" name="meta_tooltip" value="" />
</div>
<div id="form_part1">
Website URL: <input name="websiteurl">
<button
onclick="openForm_part('form_part', 2)"
>Next »</button>
</div>
<div id="form_part2">
Phone: <input name="phone">
Skype: <input name="skype">
Name: <input name="name">
Email: <input name="from">
IM: <input name="im">
</div>
<script type="text/javascript">
<!--//
function openForm_part(part_name, part_number) {
for (var p = null, i = 1;
p = document.getElementById(part_name+i); ++i) {
if (i == part_number) p.style.display = "";
else p.style.display = "none";
}
}
window.onload = function() {
openForm_part("form_part", 1);
}
//-->
</script>
</form>


but the second step does not work - dont know why..