Let's fire up our IDE and open the Magento project, where we will write some code for adding
the Twitter handle registration field.
1. Magento uses the Entity-Attribute-Value (EAV) data model for manipulating data in
a more flexible way. In an EAV data model, data is usually stored in three columns:
‰‰ Entity: This is the item being described
‰‰ Attribute or parameter: A foreign key into a table of attribute definitions
‰‰ Value: This is the value of the attribute
2. We have to add a new EAV attribute for the new Twitter field to save the user's
Twitter field with registration data. We will add it by executing a code snippet from
register.phtml file located in:
app/design/frontend/YOUR_PACKAGE/YOUR_THEME/template/customer/
form/
3. Open the aforementioned file (in my case, the file location is app/design/
frontend/base/default/template/customer/form).
4. Now paste the following code snippet at the beginning of the file:
<?php
$setup = new Mage_Eav_Model_Entity_Setup('core_setup');
$setup->addAttribute('customer', 'twitter', array(
'label' => 'Twitter handle',
'type' => 'varchar',
'input' => 'text',
'visible' => true,
'required' => false,
'position' => 1
));
?>
5. Let's find a place to put our Twitter field. Look for the following lines:
<li>
<label for="email_address"><?php echo $this->__('Email Address')
?> <span class="required">*</span></label><br/>
<input type="text" name="email" id="email_address" value="<?php
echo $this->htmlEscape($this->getFormData()->getEmail()) ?>"
title="<?php echo $this->__('Email Address') ?>" class="validateemail
required-entry input-text" />
</li>
6. Now replace the preceding code with the following (actually we added a new <li>
element with our new Twitter field):
<li>
<label for="email_address" class="required"><em>*</em><?php echo
$this->__('Email Address') ?></label>
<div class="input-box">
<input type="text" name="email" id="email_address"
value="<?php echo $this->htmlEscape($this->getFormData()-
>getEmail()) ?>" title="<?php echo $this->__('Email Address') ?>"
class="input-text validate-email required-entry" />
</div>
</li>
<li>
<label for="twitter"><?php echo $this->__('Twitter handle') ?></
label>
<div class="input-box">
<input type="text" name="twitter" id="twitter" value="<?php
echo $this->htmlEscape($this->getFormData()->getTwitter()) ?>"
title="<?php echo $this->__('Twitter') ?>" class="input-text" />
<label for="twitter" style="color: #ccc;font-size:
85%;">Example: @packtpub</label>
</div>
</li>
7. We have to modify the edit.phtml file as well so that the user can edit the Twitter
information from his account information page. Let's open it from here:
app/design/frontend/YOUR_PACKAGE/YOUR_THEME/template/customer/form/
8. Now find the code snippet (in my case, it is at line number 39):
<li>
<label for="email" class="required"><em>*</em><?php echo $this-
>__('Email Address') ?></label>
<div class="input-box">
<input type="text" name="email" id="email" value="<?php
echo $this->htmlEscape($this->getCustomer()->getEmail()) ?>"
title="<?php echo $this->__('Email Address') ?>" class="input-text
required-entry validate-email" />
</div>
</li>
9. Then replace it with the following (we added another field for our Twitter wrapped in
a <li> element):
<li>
<label for="email" class="required"><em>*</em><?php echo $this-
>__('Email Address') ?></label>
<div class="input-box">
<input type="text" name="email" id="email" value="<?php
echo $this->htmlEscape($this->getCustomer()->getEmail()) ?>"
title="<?php echo $this->__('Email Address') ?>" class="input-text
required-entry validate-email" />
</div>
</li>
<li>
<label for="twitter"><?php echo $this->__('Twitter handle') ?></
label>
<div class="input-box">
<input type="text" name="twitter" id="twitter" value="<?php
echo $this->htmlEscape($this->getCustomer()->getTwitter()) ?>"
title="<?php echo $this->__('Twitter') ?>" class="input-text" />
<label for="twitter" style="color: #ccc;font-size:
85%;">Example: @ferdous</label>
</div>
</li>
10. Now that we have added the field in the form, let's add it in our layout config
file. Open the config.xml file from app/code/core/Mage/Customer
/etc/ directory.
11. Look for the <global> block and modify it as shown in the following code snippet
(in my config.xml file, the global block is at line number 81):
<global>
<fieldsets>
<customer_account>
<prefix><create>1</create><update>1</update><name>1</name></
prefix>
<firstname><create>1</create><update>1</update><name>1</
name></firstname>
<middlename><create>1</create><update>1</update><name>1</
name></middlename>
<lastname><create>1</create><update>1</update><name>1</name></
lastname>
<suffix><create>1</create><update>1</update><name>1</name></
suffix>
<email><create>1</create><update>1</update></email>
<twitter><create>1</create><update>1</update></twitter>
<password><create>1</create></password>
<confirmation><create>1</create></confirmation>
<dob><create>1</create><update>1</update></dob>
<taxvat><create>1</create><update>1</update></taxvat>
<gender><create>1</create><update>1</update></gender>
</customer_account>
</fieldsets>
12. The last step is adding an entity attribute in the setup model. Open the Setup.php
file from the app/code/core/Mage/Customer/Model/Entity/ directory. At line
number 120 after the email field as:
'email' => array(
'type' => 'static',
'label' => 'Email',
'class' => 'validate-email',
'sort_order' => 60,
),
13. Add the following code snippet for the newly created Twitter field, right after the
e-mail setup:
'twitter' => array(
'label' => 'Twitter',
'required' => false,
'sort_order' => 65,
),
14. We are done. Point your browser to create the customer account URL and try to create
a new account.