How to override Magento admin theme template file

You as Magento developer sometimes will wish to override Magento admin theme template files. This comes in need in process of developing custom magento admin skin or some extension that will extend Magento backend design and functionality.

Basically adminhtml part keeps the same fallback ideology that is used on front end, but with some slight difference about how we define our custom admin theme.

We have forced same challenge when started to develop our Magento admin skin extension Wunderadmin. And now we want to share some our experience in it.

First of all we need to decide how we define and set our custom admin theme. It can be static theme name, set in system config on defined in your custom admin module. In our case we wanted to give ability for user to switch theme from admin theme configuration page. We’ve added theme selection select control that gets available themes list and gives user option to choose one of them. Then in our helper module we’ve added function that returns current active admin theme name.

 Now when we have name of current Magento admin theme it is time to set it. For this we add new observer function and set it to admin controller predispatch start event. In our extensions config.xml file located at

/app/code/community/Nwdthemes/Wunderadmin/etc/

we’re adding following code to global section:

<events>
  <adminhtml_controller_action_predispatch_start>
    <observers>
      <nwdthemes_wunderadmin_admin_predispatch>
        <class>Nwdthemes_Wunderadmin_Model_Adminhtml_Observer</class>
        <method>setTheme</method>
      </nwdthemes_wunderadmin_admin_predispatch>
    </observers>
  </adminhtml_controller_action_predispatch_start>
</events>

Observer model file created then in appropriate location at

/app/code/community/Nwdthemes/Wunderadmin/Model/Adminhtml/

class Nwdthemes_Wunderadmin_Model_Adminhtml_Observer {

  /**
   * Set current admin theme
   */

  public function setTheme() {
    if ( Mage::helper('nwdall')->getCfg('general/enabled', 'wunderadmin_config') )
    {
      if (Mage::helper('wunderadmin')->getWunderStyle('theme') != 'default')
      {
        Mage::getDesign()->setTheme( Mage::helper('wunderadmin')->getWunderStyle('theme') );
      }
    }
  }
}

Code is simple. First we are checking if our extension is enabled in system config. Then getting current admin theme name and if it is not the default one we set it.

Mage::getDesign()->setTheme( $themeName );

 This function sets current theme in adminhtml. Please note that if only one argument provided it sets theme for everything. And if you will provide two arguments first one will define key of target theme from second argument will be set to, keys could be: layout, template, skin, locale.

So now when our Magento admin theme is set you can follow same logic as in front end to override your Magento admin skin files.

For example your template files will be put to:

/app/design/adminhtml/default/{themeName}/template/

 In our case when we override login template file we add:

/app/design/adminhtml/default/wunderadmin/template/login.phtml

 So this file will be used instead of default one in our Wunderadmin theme.

 Of cause our theme will do some layout updates. Xml file for it will be located at:

/app/design/adminhtml/default/{themeName}/layout/local.xml

 Skin files are added here:

/skin/adminhtml/default/{themeName}/

Now armed with this knowledge you are ready to develop your own custom Magento admin theme. Or alternatively you can get our admin skin extension to improve design of Magento admin theme in theme or custom solution you develop.