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.

133
Top

Enjoyed this post?

Subscribe to our RSS Feed, Follow us on Twitter and spread it to your friends!

Author

CTO / Magento Certified Developer Plus @inchoo. Father, husband!

Other posts from this author

Discussion 133 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

1 2 3

Add Your Comment

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