Add custom input fields on Admin html forms in Magento

Adding a custom input type on the forms on Admin html is very easy.

I used this in the module which I created with Module Creator.
I supposed to show the uploaded image on the edit form on Admin. The images are uploaded by the user from the front end.

For displaying the thumbnail, by default there is no way in Magento.
So I created a new class ‘Varien_Data_Form_Element_Thumbnail’ & named it Thumbnail.php.

class Varien_Data_Form_Element_Thumbnail extends Varien_Data_Form_Element_Abstract
    public function __construct($data)

    public function getElementHtml()
        $html = '';

        if ($this->getValue()) {
            $url = $this->_getUrl();

            if( !preg_match("/^http\:\/\/|https\:\/\//", $url) ) {
                $url = Mage::getBaseUrl('media') . $url;

            $html = ''.$this->getValue().' ';
        $html.= parent::getElementHtml();

        return $html;

    protected function _getUrl()
        return $this->getValue();

    public function getName()
        return  $this->getData('name');

Copy the file at ‘/lib/Varien/Data/Form/Element/’.

To Display the thumbnail, inside the function _prepareForm() write the code below. (In my case I edited the file.. ‘app/code/local/Mage/Modulename/Block/Adminhtml/Modulename/Edit/Tab/Form.php’. This module was created with Module Creator)

$form = new Varien_Data_Form();
      $fieldset = $form->addFieldset('modulename_form', array('legend'=>Mage::helper('modulename')->__('Module information')));
      $tempArray = array(
	          'label'     => Mage::helper('arequets')->__('Sample Work'),
	          'name'      => 'samplefilename',
	          'style'     => 'display:none;',
      $fieldset->addField('samplefilename', 'thumbnail',$tempArray);

Here, ‘samplefilename’ should be the path of the thumbnail.

Related Posts

About the Author: Jignesh Patel

Jignesh Patel is a geek, an engineer & a web developer, who focus on developing web sites which look great, work great and can still work on older web browsers. Expertise in PHP, MySQL, JS, Magento & Wordpress.

  • http://www.downselot.com/ AlexAxe

    Hi, Where are you from? Is it a secret? :)
    Thank you

  • admin


    I am Jignesh. From India & I am a Web Developer.
    Having expertise on PHP, JS & also Magento these days..

  • jara

    How to add this comment form to my website in magento.

  • admin

    Hello Jara,
    Please let me know, about which comment form you are asking?

  • jara

    The comment Form which we are using to communicate,I want to add this to my website i am using magento .

  • admin

    This comment form is in this Blog setup. It can’t be added to the Magento. This site is not based on Magento.

  • jara

    ok thank you..

  • Andy

    Hello Jignesh,

    Thanks for the post. I have a question.

    If we copy the file to ‘/lib/Varien/Data/Form/Element/’, won’t it be affected during an upgrade of Magento? Or is there another path that we can put?

    I’m also guessing that it may not be affected since we are creating an entirely new file, but not sure.. hmmm…


  • admin

    You are correct I guess. During the upgrade new files created won’t be affected.
    Still its good to take backups before upgrade.

  • http://mcdonaldscouponsnews.wikispaces.com mcdonalds coupons

    Thanks very much for this nicely written post.

  • Ronald

    Hi Jignesh, great tutorial there..
    i need some enlighment here. Currently i want to add a custom textbox on checkout page for each item ordered, and save the input on my newly added field (added to sales_flat_order_item table, lets say “myCustomField”).
    i have no idea on how can i get the content from each input, and save it to the field.
    I already done the “textbox for each item” thing, but save it?? almost impossible for me..

    please help, or perhaps you can mail me instead..
    appreciated it much… thanks

  • http://www.bjergdesign.dk/ chandresh


    I want to put one textbox on add cart button page

    when user add any text in text box ,the value should be seen in whatever nextpage
    and next page is checkout

    so could you please help me how can i put one text box and redirect its value


  • http://www.gtechonline.co.uk sweeper

    Can I add another form, like the existing contact us page, which simply grabs all the submitted information and sends an email to a given admin email address? This is needed as product warranty registration page in frontend.

  • admin

    @sweeper, you can create a new custom module, using so called a ‘moduleCreator’.
    Then you can modify the files to achieve your goals.

  • Sumanta Pati

    How to upload images by the user from the front end ?
    Please Help…

  • kurt

    can i look the output of this code?

  • Anonymous

    Hello jara,
    If you are talkin about the current comment system, then its ‘DISQUS comment system’.

  • http://www.tellsys.com buy seo services

    Thanks for your information and nice explanation.Looking for more information

  • Vasanth

    how can i give textbox hint in form backend…

    For example
       $fieldset->addField(‘titlecolor’, ‘text’, array(
              ‘label’     => Mage::helper(‘banners’)->__(‘Image Title color’),
              ‘class’     => ‘required-entry’,
              ‘required’  => true,
              ‘name’      => ‘titlecolor’,

    I need to represent the color value as (Ex) 0xFFCC01…how can i do it…kindly help for this one.


blog comments powered by Disqus