Adding a new tab under one page checkout – full working module

Featured Image

Adding a new tab under onepage checkout in Magento might seem as incredibly easy task. right?! Well, it’s not. If you want to do it properly, you gonna have to do some work. Took me few hours to get this one running. Attached are screenshots for you to see final result.

Frontend

Backend1

Here is the module itself Inchoo_Heared4us.

Few words about module. It uses built in Admin theme module from a coworker Ivan Weiler. If you have this Admin theme module installer already please disable it, since its built into this Heared4us module. There is only one thing you NEED TO DO in order for module to work: Once you added it to Magento, go to System > COnfiguration > Design and write down “custom” under Admin theme section. This admin theme section will appear as soon as you refresh Admin page once you copy-pasted module. If you get “Access denie” error, please logout and login into the admin.

That’s it. If you wish to edit the questions that appear under newely added tab, open the app/design/frontend/default/default/template/checkout/onepage/heared4us.phtml file and modify the array at the very top of the file.

DO A FULL DATABASE AND FILE BACKUP BEFORE ADDING A MODULE TO LIVE STORE.
You should always do a full backup when adding modules to live store. Although the module does not have any database dependencies and stuff, it uses overrides on checkout model, controller and block. Use on your own responsibility.

What you can learn from module? -You can learn how to override (extend) default controllers, Models, Blocks. You can learn how to modify existing JS files and reuse them (reused sample of JS for tab, saved it under heared4us.phtml file itself), you can learn how to set custom theme files on admin to avoid modifying default admin theme, learn how to extend order object (or any other, from sql setup file), learn how to “attach a hook” aka observer to event… Lot to learn on a small module like this. Hope it helps.

Cheers.

149
Top

Care to rate this post?

Author

Branko Ajzele

Ex Inchooer

Worked at Inchoo as a Backend Developer/CTO from 2008 to 2013

Other posts from this author

Discussion 149 Comments

1 2 3
Add Comment
  1. If people are still struggling with the way the goal posts have moved in regards to attributes then you can always create a new model to store the data. I think this would work across most versions.

    So write an installer script / create a table hdyfu with hdyfu_id, order_id and hdyfu fields then…

    /Heared4us/Model/Hdyfu.php

    <?php
      class Inchoo_Heared4us_Model_Hdyfu extends Mage_Core_Model_Abstract
      {
          public function _construct()
          {
              parent::_construct();
              $this->_init('heared4us/hdyfu');
          }
      }
    

    /Heared4us/Model/Mysql4/Hdyfu.php

    <?php
      class Inchoo_Heared4us_Model_Mysql4_Hdyfu extends Mage_Core_Model_Mysql4_Abstract
      {
          public function _construct()
          {
              $this->_init('heared4us/hdyfu', 'hdyfu_id');
          }
      }
    

    /Heared4us/Model/Mysql4/Hdyfu/Collection.php

    <?php
          class Inchoo_Heared4us_Model_Mysql4_Hdyfu_Collection extends Mage_Core_Model_Mysql4_Collection_Abstract
          {
              public function _construct()
              {
                  //parent::__construct();
                  $this->_init('heared4us/hdyfu');
              }
          }
    

    Then in Observer.php

    <?php
    class Inchoo_Heared4us_Model_Observer
    {
    	const ORDER_ATTRIBUTE_FHC_ID = 'heared4us';
        /**
         * Event Hook: checkout_type_onepage_save_order
         *
         * @author Branko Ajzele
         * @param $observer Varien_Event_Observer
         */
    	public function hookToOrderSaveEvent()
    	{
    		//Fetch the data from select
    		$_heared4us = null;
    		$_heared4us = Mage::getSingleton('core/session')->getInchooHeared4us();
            //Attach it to the order
            $incrementId = Mage::getSingleton('checkout/session')->getLastRealOrderId();
            $order = Mage::getModel('sales/order')->loadByIncrementId($incrementId)->getData();
    		$hdyfu = Mage::getModel('heared4us/hdyfu')
                      ->setOrderId($order["entity_id"])
    				  ->setHdyfu($_heared4us)
    				  ->save();
    	}
    }
    

    You can then join this to the order grid with a

    ->joinleft(array('hdyfu' => $_hdyfuTable), 'main_table.entity_id = hdyfu.order_id')
    

    in _prepareCollection

    and a

            $this->addColumn('hdyfu', array(
                'header' => Mage::helper('ordertags')->__('Reffered By'),
                'index' => 'hdyfu',
                'width' => '70px',
            ));
    

    in _prepareColumns.

  2. Richie

    Worked great, although I don’t understand why you didn’t set it up to say “Where Did You Hear About Us” rather than “Heared For Us”….either way, nice job.

  3. @Richie

    Typo :) -It was to late to fix it later when I noticed it, meaning I was sort of lazy :)

  4. amit

    Hi Dear thanks for this module but i did not see on checkout page of modern theme in magento 1.5.1.0 plz help me how can i customized..
    Array ( [login] => Array ( [label] => Checkout Method [allow] => 1 ) [billing] => Array ( [label] => Billing Information [is_show] => 1 ) [shipping] => Array ( [label] => Shipping Information [is_show] => 1 ) [shipping_method] => Array ( [label] => Shipping Method [is_show] => 1 ) [payment] => Array ( [label] => Payment Information [is_show] => 1 ) [heared4us] => Array ( [allow] => 1 ) [review] => Array ( [label] => Order Review [is_show] => 1 ) ) after print of steps it shows i think it is not calling hearedus.php file why any reason

  5. Matt

    This works as per instructions for Magento 1.5.1.

    Same instructions here but much clearer.

    http://www.atomicpages.net/blog/2011/06/23/how-did-you-hear-about-us-in-magento-15/

    Remember to clear cache, log out, log back in, after uploading module to be able to see “Admin Theme” option.

    Does not seem to work if using PayPal Standard as a payment option.

    Any ideas on how to fix that?

  6. Irina

    Hello,

    The module works great except that the filled in tab dose not get updated on the progress bar.

    Do you maybe already have a fix for that?

  7. This works as described if I use bank deposit as the payment method. Eg the checkout step shows up & works, and I can see the value on the admin panel.

    But when using PayPal standard (which 95% of orders do), the value doesn’t show up in the admin panel, and there is no value written to the heared4us attribute in the sales_flat_order table.

    Any ideas on why this is or how to troubleshoot would be appreciated!

  8. Dominik

    @Jason:
    Can you please be more specific of your steps you’re exactly doing?

  9. Aki

    Hello Branko, thank you so much for this post. Also, thank you Michael Terracide and nemo.

    I followed your instruction as below but I couldn’t save the value.

    1) System > Configuration > Design and write down “custom” under Admin theme section.

    2) Follow Michael’s instructions above, by modifying the mysql4-install-01.0.php.
    replace
    $row = Mage::getSingleton(‘core/resource’)->getConnection(‘core_read’)->fetchRow($sql);
    to
    $row = Mage::getSingleton(‘core/resource’)->getConnection(‘core_read’)->addColumn(Mage::getSingleton(‘core/resource’)->getTableName(‘sales/order’), ‘giftaid’, ‘TEXT NULL’);

    3) Add “heard4us” in the sales_flat_order table.
    ALTER TABLE sales_flat_order ADD heared4us text;

    heared4us in sales_flat_order table is empty after the order process was completed. So I put a value manually in heared4us and it was shown in admin.

    So I think something wrong when the value is saved but I don’t know where I should fix.

    Does anyone please give me some advice? My magento version is 1.4.2.0.

  10. Aki

    I’m sorry again, I have another question. I’d like to move the step before payment. I modified 2 files, app/code/local/Inchoo/Heared4us/Block/Onepage.php and app/code/local/Inchoo/Heared4us/controllers/OnepageController.php

    After the modification, the onepage checkout step goes wrong. The process is turn back to shopping cart page. Obviously I did something wrong…. Are there other files I should change?

  11. Aki

    I’m sorry again, I did everything from the beginning and I could save the data.

    Thanks again for your article.

  12. Muhammad

    I installed it on Magento 1.6v and it’s working fine

  13. Muhammad

    How can I add simple text when my customer selects OTHER from the drop down menu?

  14. Waqar

    Hi
    I have updated all the necessary option (but I guess I am missing something). The “How did you hear about us?” doesn’t even show on the main OnePage checkout. However I managed to display it in adminpanel. Help needed.
    Thanks

  15. shweta

    I have installed this module for Magento 1.5.on frontend it’s working fine with all the options but on Backend along with order the details are not diaplying .

  16. Mayank

    Hi,
    I have followed the full process for adding the module, but it is not visible on my front end. Also I have my own theme please let me know that how could I do this process by putting the whole things in my own folder- let say fido.

    Thanks

  17. Francesco

    I have installed this module for Magento 1.6 on frontend it’s working fine with all the options but on Backend the option selected on frontend is not displayed, why??

    Thanks

  18. Hi,

    How can I download this module?

  19. hjay

    Guys I am at my wits end. I did everything above and when I try to log in to admin area after clearing cache I get an error.

    I’m using version 1.6.1

    Please help

  20. omar

    How can i add the values in this select box from admin or can i add Calendar also there

  21. hiiii this post is very useful for me, now what i want to do is, i want to combine two steps shipping method and payment information in one single steps an its procedure should remain as it is,but both value should get saved from one step. please send me the procedure with steps and files which need to be change ,if possible then pls pls send me code files for it if u have worked on like this earlier. thanks

  22. Also works in 1.7 after adjusting the mysql.php and manually adding the field.

    First I thought it didnt worked because I didnt see the value in the admin and didnt got saved to database. Couldnt delete cache because it wasnt on but did delete old cache files which were in the map var/cache and the sessions in var/sessions and it worked.

    Also replaced the options with a textarea which worked fine as long as you kept the id=”getvoice” name=”getvoice”.

  23. Only got a weird problem that when I reach the field the sidebar gets emptied. But when im at the last step its filled again.

  24. luca

    Hallo, thanks for this module, but not work..
    After placing the files in my shop, I get this error:
    Mage registry key “_singleton/Inchoo_Heared4us_Controller_Observer” already exists..
    Where is the problem?
    thanks
    regards luke

  25. Hi,

    The module works fine but I want the extra tab to be shown in only one store I have 2 stores in the Site and I want to add the extra step in one store only how can I do that.

    Thanks & Regards,
    Srikanth thandra

  26. Arjun

    here its not working if your module working fine then plz tell me some instructions for this.

  27. Ronny

    Hi,

    Cuurently i am using this modulke in the standard checkout. And this works very well.

    But i have bought a one page checkout module – without this functionality.

    Now i would like add this too.
    But when i just copy-past the code from the heared4us.phtml into the onepagecheckout it will not work. What piece of javascript must i keep, so i can use it correctly?

  28. Julian

    I’d like to add this. However it after uploading it doesn’t seem to add the Admin Theme option, nor do I see it in available modules under Advanced. Running 1.7.0.2.

  29. bam

    Hi guys,

    I hope some one can help.

    using magento 1.7.0.0 I have installed the module and i get an error as follows, this shows on the one page checkout with display errors on..

    Notice: Undefined index: heared4us in C:\zend\Apache\htdocs\magento\app\code\core\Mage\Checkout\Block\Onepage\Progress.php on line 93

    when we look at this line its obvious that the array $stepsRevertIndex is missing ‘hearded4us’

    Array
    (
    [login] => 0
    [billing] => 1
    [shipping] => 2
    [shipping_method] => 3
    [payment] => 4
    [review] => 5
    )

    any pointers here would be welcome,

    thanks,
    bam

  30. Hi,

    i upload modules front end its working properly,but i can able to get the value in admin side sales ->order -
    Where did you heared about us (in this place field is empty),

    Advance thanks,i am using 1.7.0.2

  31. Hi,

    i need this module for 1.7.0.2 version pls help,Advance thanks

  32. Hi Guys,
    for i solved the problem.. :) its quite easy than your thoughts :D

    for display content in admin section just change this file:

    app\code\local\Inchoo\Heared4us\sql\heared4us_setup\mysql4-install-0.1.0.php

    //START Add order attribute by Branko Ajzele
    $sql = “SELECT entity_type_id FROM “.$this->getTable(‘eav_entity_type’).” WHERE entity_type_code=’order’”;
    $row = Mage::getSingleton(‘core/resource’)->getConnection(‘core_read’)->fetchRow($sql);

    $attribute = array(
    ‘type’ => ‘text’,
    ‘label’ => ‘Heared4us’,
    ‘visible’ => false,
    ‘required’ => false,
    ‘user_defined’ => false,
    ‘searchable’ => false,
    ‘filterable’ => false,
    ‘comparable’ => false,
    );

    $installer->addAttribute($row['entity_type_id'], ‘heared4us’, $attribute);
    //END Add customer attribute Branko Ajzele

    to this:

    //START Add order attribute by Branko Ajzele
    $sql = “SELECT entity_type_id FROM “.$this->getTable(‘eav_entity_type’).” WHERE entity_type_code=’order’”;
    $row = Mage::getSingleton(‘core/resource’)->getConnection(‘core_read’)->fetchRow($sql);

    $attribute = array(
    ‘type’ => ‘text’,
    ‘label’ => ‘heared4us’,
    ‘visible’ => false,
    ‘required’ => false,
    ‘user_defined’ => false,
    ‘searchable’ => false,
    ‘filterable’ => false,
    ‘comparable’ => false,
    );

    $installer->addAttribute($row['entity_type_id'], ‘heared4us’, $attribute);
    //END Add customer attribute Branko Ajzele

    what i did just check the ‘label’ capital H to lower h
    thats it :) Enjoy and if you find it useful just let me know :)

  33. UPDATED……….!

    //START Add order attribute by Branko Ajzele
    $sql = “SELECT entity_type_id FROM “.$this->getTable(‘eav_entity_type’).” WHERE entity_type_code=’order’”;
    $row = Mage::getSingleton(‘core/resource’)->getConnection(‘core_read’)->addColumn(Mage::getSingleton(‘core/resource’)->getTableName(‘sales/order’), ‘giftaid’, ‘TEXT NULL’);

    $attribute = array(
    ‘type’ => ‘text’,
    ‘label’ => ‘heared4us’,
    ‘visible’ => false,
    ‘required’ => false,
    ‘user_defined’ => false,
    ‘searchable’ => false,
    ‘filterable’ => false,
    ‘comparable’ => false,
    );

    $installer->addAttribute($row['entity_type_id'], ‘heared4us’, $attribute);
    //END Add customer attribute Branko Ajzele

  34. Is it possible to show extra tab and add that value in sales order mail?
    I have already tried extra tab.Now i want to know is it possible to show extra tab value in sales order mail?

  35. Vikram

    I uploaded it and got following error :

    CONNECT ERROR: Package file is invalid
    Invalid package name, allowed: [a-zA-Z0-9_-] chars
    Invalid version, should be like: x.x.x
    Invalid stability
    Invalid date, should be YYYY-DD-MM
    Invalid channel URL
    Empty authors section
    Empty package contents section

    any help ????/

  36. Adam Hodson

    I’m using magento 1.7 and everything is working except posting the info from the extra tab to the order info. I’ve done all the updates including the MySql update Umair suggested, but it’s still not working. I am checking out with “Check/Moneyorder” as an option, could this be the problem?

    Has anyone had success with this on 1.7?

  37. Hello,
    I have install your module but i can’t see this saved steps in sales order view page as like second image shown above.
    Can you explane why this thing happend ?

  38. Hi Friends,

    I have found a solution for saving the heard4us data in the database in magento 1.7 . you need to add the following piece of code in the OnepageController file of heared4us module which is extending the default onepagecontroller.

    /**
    * Create order action
    */
    public function saveOrderAction()
    {

    if ($this->_expireAjax()) {
    return;
    }

    $result = array();
    try {
    if ($requiredAgreements = Mage::helper(‘checkout’)->getRequiredAgreementIds()) {
    $postedAgreements = array_keys($this->getRequest()->getPost(‘agreement’, array()));
    if ($diff = array_diff($requiredAgreements, $postedAgreements)) {
    $result['success'] = false;
    $result['error'] = true;
    $result['error_messages'] = $this->__(‘Please agree to all the terms and conditions before placing the order.’);
    $this->getResponse()->setBody(Mage::helper(‘core’)->jsonEncode($result));
    return;
    }
    }
    if ($data = $this->getRequest()->getPost(‘payment’, false)) {

    $this->getOnepage()->getQuote()->getPayment()->importData($data);
    }

    $this->getOnepage()->saveOrder();//print_r($rd->getOrderId);

    //——————–Save heared 4 us —————————————–//
    $order = new Mage_Sales_Model_Order();
    $incrementId = Mage::getSingleton(‘checkout/session’)->getLastRealOrderId();
    $order->loadByIncrementId($incrementId);

    //Fetch the data from select box and throw it here
    $_heared4us_data = null;
    $_heared4us_data = Mage::getSingleton(‘core/session’)->getInchooHeared4us();
    //Save fhc id to order obcject
    $order->setData(‘heared4us’, $_heared4us_data);
    $order->save();
    //———————Save heared 4 us ends————————————-//

    $redirectUrl = $this->getOnepage()->getCheckout()->getRedirectUrl();
    $result['success'] = true;
    $result['error'] = false;
    } catch (Mage_Payment_Model_Info_Exception $e) {
    $message = $e->getMessage();
    if( !empty($message) ) {
    $result['error_messages'] = $message;
    }
    $result['goto_section'] = ‘payment’;
    $result['update_section'] = array(
    ‘name’ => ‘payment-method’,
    ‘html’ => $this->_getPaymentMethodsHtml()
    );
    } catch (Mage_Core_Exception $e) {
    Mage::logException($e);
    Mage::helper(‘checkout’)->sendPaymentFailedEmail($this->getOnepage()->getQuote(), $e->getMessage());
    $result['success'] = false;
    $result['error'] = true;
    $result['error_messages'] = $e->getMessage();

    if ($gotoSection = $this->getOnepage()->getCheckout()->getGotoSection()) {
    $result['goto_section'] = $gotoSection;
    $this->getOnepage()->getCheckout()->setGotoSection(null);
    }

    if ($updateSection = $this->getOnepage()->getCheckout()->getUpdateSection()) {
    if (isset($this->_sectionUpdateFunctions[$updateSection])) {
    $updateSectionFunction = $this->_sectionUpdateFunctions[$updateSection];
    $result['update_section'] = array(
    ‘name’ => $updateSection,
    ‘html’ => $this->$updateSectionFunction()
    );
    }
    $this->getOnepage()->getCheckout()->setUpdateSection(null);
    }
    } catch (Exception $e) {
    Mage::logException($e);
    Mage::helper(‘checkout’)->sendPaymentFailedEmail($this->getOnepage()->getQuote(), $e->getMessage());
    $result['success'] = false;
    $result['error'] = true;
    $result['error_messages'] = $this->__(‘There was an error processing your order. Please contact us or try again later.’);
    }
    $this->getOnepage()->getQuote()->save();
    /**
    * when there is redirect to third party, we don’t want to save order yet.
    * we will save the order in return action.
    */
    if (isset($redirectUrl)) {
    $result['redirect'] = $redirectUrl;
    }

    $this->getResponse()->setBody(Mage::helper(‘core’)->jsonEncode($result));
    }

    .

  39. Newby

    Hi

    This is great – got it working, using 1.7.0.2.

    Now I want to add this to e-mails going out after checkout – how do I do that? Any help? Please?

    Thank you

  40. Manibharathi

    Hai frnds,

    It didn’t work for me i am using 1.8.0.0 veraion any one help me…

    Thank you.,

  41. Newby

    Thank you Jignesh

    Got it showing in emails going out!

  42. Roberto

    thanks man, good job, its works pretty fine

  43. Roberto

    How can i add a tab as step 1???? , i meant put a custom tab at the beginning

  44. Pat

    Has anyone had any luck with having the options display in the admin in orders?

  45. Marius

    For some orders the answer is not saved in 1.7.0.2.! any help ????/

  46. Arshad

    Hi,
    this module works like charms but when i disable this module to check checkout process working fine by disabling this module then it shown me blank page on checkout page but when i enable it, checkout page working fine, that mean some thing going wrong when we disable this module.

    any one solve this issue previously ?

  47. Sendrayan

    How to change the order of steps ? I want to place “Where did you heared for us” step after login step and before billing step. How to change checkout steps in this extension ?

    Thanks in advance.

  48. Andrew

    Can’t get this to work, when i follow the steps and try loading my sales order page it comes up as a blank page and when i finish checkout after clicking place order it loads a blank page as well.

  49. vikas

    Hi,

    I am new to magento.

    Can i add this module before “payment information” method. also can you explain clearly how i can add this magento module to create one more step in checkout. you can send the solution to my mail or you can post the details of creating module here.

    Thanks in Advance.

1 2 3

Add Your Comment

Please wrap all source codes with [code][/code] tags.
Top