How to add custom field in Magento Contact us Form

Step 1: Open [magento_root]/app/design/frontend/default/default/template/contacts/form.phtml in your favorite editor

Step 2: Copy & paste an existing form field code on this script and rename the field to create new field. For example:

This is the default code in the file:

<div class="input-box">
<label for="email"><?php echo Mage::helper('contacts')->__('Email') ?> <span class="required">*</span></label>
<input name="email" id="email" title="<?php echo Mage::helper('contacts')->__('Email') ?>" value="<?php echo $this->htmlEscape($this->helper('contacts')->getUserEmail()) ?>" class="required-entry input-text validate-email" type="text" />
</div>
<div class="clear"></div>
<div class="input-box">
<label for="telephone"><?php echo Mage::helper('contacts')->__('Telephone') ?></label>
<input name="telephone" id="telephone" title="<?php echo Mage::helper('contacts')->__('Telephone') ?>" value="" class="input-text" type="text" />
</div>

This is how the modified code will look like:

<div class="input-box">
<label for="email"><?php echo Mage::helper('contacts')->__('Email') ?> <span class="required">*</span></label>
<input name="email" id="email" title="<?php echo Mage::helper('contacts')->__('Email') ?>" value="<?php echo $this->htmlEscape($this->helper('contacts')->getUserEmail()) ?>" class="required-entry input-text validate-email" type="text" />
</div>
<div class="clear"></div>
<span style="background-color: rgb(255, 255, 0);"><!-- New Field Code-->
<div class="input-box">
<label for="website"><?php echo Mage::helper('contacts')->__('Website') ?></label>
<input name="website" id="website" title="<?php echo Mage::helper('contacts')->__('Website') ?>" value="" class="input-text" type="text" />
</div>
<div class="clear"></div>
<!-- End New Field Code--></span>
<div class="input-box">
<label for="telephone"><?php echo Mage::helper('contacts')->__('Telephone') ?></label>
<input name="telephone" id="telephone" title="<?php echo Mage::helper('contacts')->__('Telephone') ?>" value="" class="input-text" type="text" />
</div>

Step 3: Now go to, System > Transaction Emails.

Step 4: Click ‘Add New Template’

Step 5: In the ‘Load default template’ section, select ‘Contact Form’ template and click ‘Load Template’

Step 6: The template content will look like this:

Name: {{var data.name}}
E-mail: {{var data.email}}
Telephone: {{var data.telephone}}

Comment: {{var data.comment}}

Step 7: Add your new field in this content like this:

Name: {{var data.name}}
E-mail: {{var data.email}}
Website: {{var data.website}}
Telephone: {{var data.telephone}}

Comment: {{var data.comment}}

Step 8: Enter a new ‘Template Name’ and click ‘Save template’

Step 9: Now go to, System > Configuration > Contacts

Step 10: Click the ‘Email Options’ section on this page and select the new template that you just created.

Step 11: Click ‘Save Config’

Hope it Helps.... Thanks.......