WPservice DEVELOPMENT STUDIO PRESENTS
LONG-TERM GROWTH
We always design our websites with your future success in mind, carefully planning and optimizing all content to ensure maximum visibility and long-term profitability

An Introduction To Magento Template Development

magento template developmentMagento has grown to become one of the most powerful and flexible of all the eCommerce platforms on the Internet in 2015.

The problem is, though, that despite its growing popularity, online documentation for it remains scarce. This is a problem for budding theme developers who want to learn more about Magento template development. So to help you out, we’re going to cover the basics of Magento custom theme development in this tutorial.

Magento Template Development Basics

Magento Hierarchy

There is a Magento Hierarchy that you need to be aware of; it will tell you where your theme falls into place. Because there are thousands of files, we will concentrate on only the essentials:

app/design/frontend/base/default/
app/design/frontend/default/default/
app/design/frontend/<package_name>/<theme_name>/
skin/frontend/base/default/
skin/frontend/default/default/
skin/frontend/<package_name>/<theme_name>/

Mercifully, there are just two folders you will use:

  • App – contains all your files for page templates structure
  • Skin – contains CSS, JavaScript and image files

Packages And Themes

The next step on your Magento template development learning curve is to find out more about packages and themes.

A package is basically a group of themes that are related to each other. You can have as many as you want.

A theme is a sub-folder of a package. In here, you will find all the themes that help to create your theme. Without them, your theme will fall apart. Again, you can have as many as you want.

What Is Base?

Base is one of your essential packages, and it contains just one theme – the default theme.

Base is installed automatically and contains the vital files that ensure your store runs smoothly.

You must not edit the base files. That’s a rule for Magento theme development. You also need to backup your base files because, whenever you upgrade Magento, your base package files will be overwritten, which means you will lose all your work!

You also must not create any themes inside this package.

What Is Default?

Understanding default is essential for Magento custom theme development. Default is another package that is automatically installed with Magento. It has four themes attached to it:

  • Default
  • Blank
  • iPhone
  • Modern

All the base package rules above apply here too.

Fallback Logic

Magento uses something called FallBack logic to ensure that your themes are easy to maintain. There is a restriction, though: You can only edit files that are needed.

FallBack Logic also ensures that your clean code base is only clean if themes are kept to their bare essentials.

How To Create A Package/Theme

Magento template development is actually really simple once you know how.

The first thing you need to do is create a package/theme setup.

To do this, create these two folders:

app/design/frontend/Mikeshaw/default/
skin/frontend/Mikeshaw/default/

Our package is called Mikeshaw, and our theme is named default – but you can name yours whatever you like. (though it is recommended to always name your theme default).

All you need to do now is enable the package. To do this, login in to the admin area before going to system > config.

Then select “design” and enter your package name.

You will also see a “themes section”. This is where you would normally enter your theme name. If, however, your theme name is “default”, you don’t need to enter anything.

And voila! You’re all done 🙂

Comments are closed.