How to Add Custom Field in the Billing and Shipping Address of Onepage Checkout in Magento

Sometimes we need to add some Custom fields in the Billing and Shipping Address of the Onepage Checkout for Registered user, Guest user and at the time of Registration.

I have created the module for adding the new custom field in the Billing and Shipping address of the Onepage checkout. All the code of the module is given below.

Step: – 1
Add Custom Field into Billing Address tab of the Onepage Checkout in Frontend.
app\design\frontend\[Package_name]\[Theme_name]\template\checkout\onepage\billing.phtml

<li class="wide">
<label for="billing:jobtitle"><?php echo $this->__('Job Title') ?></label>
<div class="input-box">
<input type="text" id="billing:jobtitle" name="billing[jobtitle]" value="<?php echo $this->htmlEscape($this->getAddress()->getJobtitle()) ?>" title="<?php echo $this->__('Job Title') ?>" class="input-text" />
</div>
</li>

Step: – 2
Add Custom Field into Shipping Address tab of the Onepage Checkout in Frontend.
app\design\frontend\[Package_name]\[Theme_name]\template\checkout\onepage\shipping.phtml

<li class="wide">
<label for="shipping:jobtitle"><?php echo $this->__('Job Title') ?></label>
<div class="input-box">
<input type="text" id="shipping:jobtitle" name="shipping[jobtitle]" value="<?php echo $this->htmlEscape($this->getAddress()->getJobtitle()) ?>" title="<?php echo $this->__('Job Title') ?>" class="input-text" onchange="shipping.setSameAsBilling(false);" />
</div>
</li>

Step: – 3
Add Custom Field into Customer Address Edit tab in Frontend.
app\design\frontend\[Package_name]\[Theme_name]\template\customer\address\edit.phtml

<li class="wide">
<label for="jobtitle"><?php echo $this->__('Job Title') ?></label>
<div class="input-box">
<input type="text" name="jobtitle" id="jobtitle" title="<?php echo $this->__('Job Title') ?>" value="<?php echo $this->htmlEscape($this->getAddress()->getJobtitle()) ?>" class="input-text" />
</div>
</li>

Step: – 4
I have made some changes to the Address Templates in Magento Admin. if you are using Magento Version 1.3.2.4 then you have to made changes in the following file.

app/code/core/Mage/Customer/etc/config.xml

and if you are using Magento Upper Version than 1.3.2.4 then you can chage from the Admin panel of the Magento as given following path.

System->Configuration->Customers->Customer Configurations->Address Templates

Add following code in the “Text” Textarea.

{{depend prefix}}{{var prefix}} {{/depend}}{{var firstname}} {{depend middlename}}{{var middlename}} {{/depend}}{{var lastname}}{{depend suffix}} {{var suffix}}{{/depend}}
    {{depend company}}{{var company}}{{/depend}}
    {{depend jobtitle}}{{var jobtitle}}{{/depend}}
    {{if street1}}{{var street1}}
    {{/if}}
    {{depend street2}}{{var street2}}{{/depend}}
    {{depend street3}}{{var street3}}{{/depend}}
    {{depend street4}}{{var street4}}{{/depend}}
    {{if city}}{{var city}},  {{/if}}{{if region}}{{var region}}, {{/if}}{{if postcode}}{{var postcode}}{{/if}}
    {{var country}}
    T: {{var telephone}}
    {{depend fax}}F: {{var fax}}{{/depend}}

Step: – 5
I have made some changes to the Address Templates in Magento Admin. if you are using Magento Version 1.3.2.4 then you have to made changes in the following file.

app/code/core/Mage/Customer/etc/config.xml

and if you are using Magento Upper Version than 1.3.2.4 then you can chage from the Admin panel of the Magento as given following path.

System->Configuration->Customers->Customer Configurations->Address Templates

Add following code in the “HTML” Textarea.

    {{depend prefix}}{{var prefix}} {{/depend}}{{var firstname}} {{depend middlename}}{{var middlename}} {{/depend}}{{var lastname}}{{depend suffix}} {{var suffix}}{{/depend}}<br/>
    {{depend company}}{{var company}}<br />{{/depend}}
    {{depend jobtitle}}{{var jobtitle}}<br />{{/depend}}
    {{if street1}}{{var street1}}<br />{{/if}}
    {{depend street2}}{{var street2}}<br />{{/depend}}
    {{depend street3}}{{var street3}}<br />{{/depend}}
    {{depend street4}}{{var street4}}<br />{{/depend}}
    {{if city}}{{var city}},  {{/if}}{{if region}}{{var region}}, {{/if}}{{if postcode}}{{var postcode}}{{/if}}<br/>
    {{var country}}<br/>
    {{depend telephone}}T: {{var telephone}}{{/depend}}
    {{depend fax}}<br/>F: {{var fax}}{{/depend}}

Step: – 6
I have made some changes to the Address Templates in Magento Admin. if you are using Magento Version 1.3.2.4 then you have to made changes in the following file.

app/code/core/Mage/Customer/etc/config.xml

and if you are using Magento Upper Version than 1.3.2.4 then you can chage from the Admin panel of the Magento as given following path.

System->Configuration->Customers->Customer Configurations->Address Templates

Add following code in the “PDF” Textarea.

    {{depend prefix}}{{var prefix}} {{/depend}}{{var firstname}} {{depend middlename}}{{var middlename}} {{/depend}}{{var lastname}}{{depend suffix}} {{var suffix}}{{/depend}}|
    {{depend company}}{{var company}}|{{/depend}}
    {{depend jobtitle}}{{var jobtitle}}|{{/depend}}
    {{if street1}}{{var street1}}
    {{/if}}
    {{depend street2}}{{var street2}}|{{/depend}}
    {{depend street3}}{{var street3}}|{{/depend}}
    {{depend street4}}{{var street4}}|{{/depend}}
    {{if city}}{{var city}},  {{/if}}{{if region}}{{var region}}, {{/if}}{{if postcode}}{{var postcode}}{{/if}}|
    {{var country}}|
    {{depend telephone}}T: {{var telephone}}{{/depend}}|
    {{depend fax}}<br />F: {{var fax}}{{/depend}}|

I have created the separate module for adding Custom Field into Billing and Shipping Address in Frontend and Backend of the Magento Store.

Step: – 7
app\etc\modules\Tdg_All.xml
First of all create file with above given name and put following code into that file.

<?xml version="1.0" encoding="UTF-8"?>
<config>
	<modules>
		<Tdg_Check>
			<active>true</active>
			<codePool>local</codePool>
		</Tdg_Check>
	</modules>
</config>

Step: – 8
app\code\local\Tdg\Check\etc\ config.xml

<?xml version="1.0" encoding="UTF-8"?>
<config>
	<modules>
		<Tdg_Check>
			<version>1.0.0</version>
		</Tdg_Check>
	</modules>
	<admin>
		<fieldsets>
			<customer_dataflow>
				<jobtitle><billing>1</billing><shipping>1</shipping></jobtitle>
			</customer_dataflow>
		</fieldsets>
	</admin>
	<global>
		<models>
			<check>
				<class>Tdg_Check_Model</class>
			</check>
		</models>
		<resources>
			<check_setup>
				<setup>
					<module>Tdg_Check</module>
				</setup>
				<connection>
					<use>core_setup</use>
				</connection>
			</check_setup>
			<check_write>
				<connection>
					<use>core_write</use>
				</connection>
			</check_write>
			<check_read>
				<connection>
					<use>core_read</use>
				</connection>
			</check_read>
		</resources>
		<fieldsets>
			<sales_copy_order_billing_address>
				<jobtitle><to_order>*</to_order></jobtitle>
			</sales_copy_order_billing_address>
			<sales_copy_order_shipping_address>
				<jobtitle><to_order>*</to_order></jobtitle>
			</sales_copy_order_shipping_address>
			<sales_convert_quote_address>
				<jobtitle><to_order_address>*</to_order_address><to_customer_address>*</to_customer_address></jobtitle>
			</sales_convert_quote_address>
			<sales_convert_order_address>
				<jobtitle><to_quote_address>*</to_quote_address></jobtitle>
			</sales_convert_order_address>
			<customer_address>
				<jobtitle><to_quote_address>*</to_quote_address></jobtitle>
			</customer_address>
			<checkout_onepage_billing>
				<jobtitle><to_customer>*</to_customer></jobtitle>
			</checkout_onepage_billing>
		</fieldsets>
	</global>
</config>

Step: – 9
app\code\local\Tdg\Check\sql\check_setup\ mysql4-install-1.0.0.php

<?php
	/* @var $installer Mage_Customer_Model_Entity_Setup */
    $installer = $this;
    $installer->startSetup();
    /* @var $addressHelper Mage_Customer_Helper_Address */
    $addressHelper = Mage::helper('customer/address');
    $store         = Mage::app()->getStore(Mage_Core_Model_App::ADMIN_STORE_ID);

    /* @var $eavConfig Mage_Eav_Model_Config */
    $eavConfig = Mage::getSingleton('eav/config');

    // update customer address user defined attributes data
    $attributes = array(
        'jobtitle'           => array(
            'label'    => 'Job Title',
            'backend_type'     => 'varchar',
            'frontend_input'    => 'text',
            'is_user_defined'   => 1,
            'is_system'         => 0,
            'is_visible'        => 1,
            'sort_order'        => 140,
            'is_required'       => 1,
            'multiline_count'   => 0,
            'validate_rules'    => array(
                'max_text_length'   => 255,
                'min_text_length'   => 1
            ),
        ),
    );

    foreach ($attributes as $attributeCode => $data) {
        $attribute = $eavConfig->getAttribute('customer_address', $attributeCode);
        $attribute->setWebsite($store->getWebsite());
        $attribute->addData($data);
            $usedInForms = array(
                'adminhtml_customer_address',
                'customer_address_edit',
                'customer_register_address'
            );
            $attribute->setData('used_in_forms', $usedInForms);
        $attribute->save();
    }

    $installer->run("
        ALTER TABLE {$this->getTable('sales_flat_quote_address')} ADD COLUMN `jobtitle` VARCHAR(255) CHARACTER SET utf8 DEFAULT NULL AFTER `fax`;
         ALTER TABLE {$this->getTable('sales_flat_order_address')} ADD COLUMN `jobtitle` VARCHAR(255) CHARACTER SET utf8 DEFAULT NULL AFTER `fax`;
        ");
    $installer->endSetup();
?>