How to create a new Package/Theme in Magento

How Magento Theme Fall-back Works.

If you create a new Package/Theme the first place Magento will look for a file is

    • app/design/frontend/Your_Package/Your_theme/
    • skin/frontend/Your_Package/Your_theme

If Magento cannot find the file in Your Package/Your Theme it will look in:

    • app/design/frontend/Your_Package /default
    • skin/frontend/Your_Package/default

If Magento cannot find the file in Your_Package/default it will look in:

    • app/design/frontend/base/default
    • skin/frontend/base/default

Ok enough about Magento Theme Fall-back. Let’s create a new Package/Theme.

How to Create a New Package/Theme

In the instructions below, I am assuming you are basing your theme on Base/Default.

  • Go to app/design/frontend
  • Create a new package folder. I would make this the name of your client e.g “nike”
  • Go to app/design/frontend/nike
  • Create a new theme folder named “master”. This is my preference, this folder can have any name.
  • Copy the default theme folder from base into the folder nike. (This isnt required but again this is my preference for an extra fall back.)

You now should have a folder structure like this:


  • Go to skin/frontend/
  • Create a new folder called “nike” this must match your package name
  • Go to skin/frontend/nike
  • Create a new folder named “master”

You now should have a folder structure like this:


There is no need for a default folder here.

  • Copy the contents of skin/frontend/default/default (css folder, images folder) to skin/frontend/nike/master

You now should have a folder structure like this:


The next steps are to tell Magento it has a new package/theme and to use it.

  • Log into Magento Admin
  • Go to System/Configuration/General/Design
  • Under Package/Current Package Name, enter your package name “nike”
  • Under Themes enter “master” for Translations/Templates/Skin(Images/Css) and Layout
  • Under Default, enter default.
    The Default field tells Magento, if you don’t find the file in nike/master, check nike/default before checking base/default.
  • Click Save Config

And that’s it, simple as that.

At this point it’s important to note that you should ONLY copy the files from app/design/frontend/nike/default into app/design/frontend/nike/master that you want to edit. This is where the excellent fall-back logic kicks in.

Was this article helpful?

Related Articles