Add label texts inside the checkout fields

[antrax13]

Hi,

i need add labels with reference texts inside the checkout fields, for example:

inside the fields       *Frist Name: Jhon    *Last Name: Doe

and when customers enter his name and last name in these fields the reference texts disappear, similar to mini search text  "Search entire store here..."

 

Regards!

[MageWorxTeam · Accepted solution]

Most likely, you need to use the placeholders: http://www.w3schools.com/tags/att_input_placeholder.asp

In your case (name and surname) is the template app/design/frontend/base/default/template/customer/widget/name.phtml or its analogue in your theme.

You should substitute the line:

<input type="text" id="<?php echo $this->getFieldId('firstname')?>" name="<?php echo $this->getFieldName('firstname')?>" value="<?php echo $this->escapeHtml($this->getObject()->getFirstname()) ?>" title="<?php echo $this->getStoreLabel('firstname') ?>" maxlength="255" class="input-text <?php echo $this->helper('customer/address')->getAttributeValidationClass('firstname') ?>" <?php echo $this->getFieldParams() ?> />

with this

<input type="text" id="<?php echo $this->getFieldId('firstname')?>" name="<?php echo $this->getFieldName('firstname')?>" value="<?php echo $this->escapeHtml($this->getObject()->getFirstname()) ?>" title="<?php echo $this->getStoreLabel('firstname') ?>" maxlength="255" class="input-text <?php echo $this->helper('customer/address')->getAttributeValidationClass('firstname') ?>" <?php echo $this->getFieldParams() ?> placeholder="<?php echo $this->getStoreLabel('firstname') ?>" />

To add the placeholder for name.

In case of surname you have to substitute the input with surname:

<input type="text" id="<?php echo $this->getFieldId('lastname')?>" name="<?php echo $this->getFieldName('lastname')?>" value="<?php echo $this->escapeHtml($this->getObject()->getLastname()) ?>" title="<?php echo $this->getStoreLabel('lastname') ?>" maxlength="255" class="input-text <?php echo $this->helper('customer/address')->getAttributeValidationClass('lastname') ?>" <?php echo $this->getFieldParams() ?> />

with this

<input type="text" id="<?php echo $this->getFieldId('lastname')?>" name="<?php echo $this->getFieldName('lastname')?>" value="<?php echo $this->escapeHtml($this->getObject()->getLastname()) ?>" title="<?php echo $this->getStoreLabel('lastname') ?>" maxlength="255" class="input-text <?php echo $this->helper('customer/address')->getAttributeValidationClass('lastname') ?>" <?php echo $this->getFieldParams() ?> placeholder="<?php echo $this->getStoreLabel('lastname') ?>" />

In the same way you can add the placeholders for other text inputs, like middle name.

[antrax13]

placeholder="your text"

Also you can add this code with your custom text.