OpptyStep1.page
Force.com Cookbook Sample Code
Chapter 13: Getting Started with Visualforce - Creating a Wizard with Visualforce Pages
To download all the code samples, access the Cookbook. - 
Page 1 of the wizard.
<apex:page controller="newOpportunityController" tabStyle="Opportunity">
<apex:sectionHeader title="New Customer Opportunity" subtitle="Step 1 of 3"/>
<apex:form>
<apex:pageBlock title="Customer Information">
<!-- This facet tag defines the "Next" button that appears
in the footer of the pageBlock. It calls the step2()
controller method, which returns a pageReference to
the next step of the wizard. -->
<apex:facet name="footer">
<apex:commandButton action="{!step2}" value="Next" styleClass="btn"/>
</apex:facet>
<apex:pageBlockSection title="Account Information">
<!-- <apex:panelGrid> tags organize data in the same way as
a table. It places all child elements in successive cells,
in left-to-right, top-to-bottom order -->
<!-- <apex:outputLabel> and <apex:inputField> tags can be bound
together with the for and id attribute values,
respectively. -->
<apex:panelGrid columns="2">
<apex:outputLabel value="Account Name" for="accountName"/>
<apex:inputField id="accountName" value="{!account.name}"/>
<apex:outputLabel value="Account Site" for="accountSite"/>
<apex:inputField id="accountSite" value="{!account.site}"/>
</apex:panelGrid>
</apex:pageBlockSection>
<apex:pageBlockSection title="Contact Information">
<apex:panelGrid columns="2">
<apex:outputLabel value="First Name" for="contactFirstName"/>
<apex:inputField id="contactFirstName" value="{!contact.firstName}"/>
<apex:outputLabel value="Last Name" for="contactLastName"/>
<apex:inputField id="contactLastName" value="{!contact.lastName}"/>
<apex:outputLabel value="Phone" for="contactPhone"/>
<apex:inputField id="contactPhone" value="{!contact.phone}"/>
</apex:panelGrid>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</apex:page>
Sample code provided by salesforce.com. All rights reserved.