Implement Parent/Child Theme in Magento

At some point you will need to modify the code of the theme to customize a particular page to your needs. On Magento this is easily done by creating a child theme and modifying its files instead. This will protect the changes from being overwritten when you upgrade Magento or Intenso theme to a new version.

Like other popular CMS systems, Magento is based on a fall-back hierarchy, which means that if you have set a custom child theme, Magento will use the files of your child theme, and if it doesn’t find some of the necessary files it will use the ones from Intenso (and if the file is not present on Intenso it will use the Base default theme)

Instead of opening the template file and making modification to it, it is recommended to make a copy of that file and place it on your own child theme. In this article you will learn how to create a child theme and add to it the files you need to modify.

Magento consists of multiple template files, each one used to render a block of content in the frontend of the store. When you want to customize some section of a theme, you need to find first what is the name and route of the template file rendering that specific block. You can display the name of the template files of every block in the frontend by enabling Magento’s Template Path Hints.

To enable Magento’s Template Path Hints go to System > Configuration > Developer. Select your current website under Current Configuration Scope in the top left corner of the admin panel, and set Debug > Template Path Hints to Yes.

Now open the page you want to customize and find the path to the template. This way you can easily check which template files you need to edit to customize specific sections of Magento. Files that need to be modified can be copied to your custom sub-theme.

Child-Theme folder structure

The child-theme folder structure should be as follows:

sub-theme-tree

In this case we named the folder “custom”, but you can use any name you like.

Once you have identified the right template to edit, you have to make a copy of the original file and paste it into your sub-theme directory. The directory structure inside the sub-theme must replicate the directory structure of the default theme.

When you’re creating a sub-theme in Magento you should only copy the files which you want to modify. Do not copy all files. Otherwise you will have tons of additional work in the future with any theme upgrade.

Activating the Child-Theme

You need to perform one additional step to let know Magento where to find your modified files. Just go to System > Configuration > Design, click the Themes tab and enter the name of your child-theme folder in the Default field.

sub-theme-design-settings

Note: design changes made in System > Design overrides theme configurations made in System > Configuration > Design
Only use the System > Design menu to set seasonal design themes.