Magento follows a pretty straight-forward templating structure. Well, it’s straight forward once you get to know it. It can be a little confusing at first to a html designer or someone who has worked in drupal or wordpress.
The first thing to remember is that anything not defined falls back to base/default. So if you don’t define a template file, that’s OK, there’s a backup that will render the page for you. This lets you know that every page in your magento store will work, assuming you didn’t break anything.
First thing’s first, the package name in System->Configuration->Design. You can set this on the global level, or a website, or even store view level. This sets the package name that will be referenced in the next paragraph or two about the rest of the template structure. For us, we always set that to evermoretech. All the themes we develop are within that package. Others will use their company name, the client name, or just work within default for their themes.
Next up are the other 4 values you get to set. Often, they are all set to one value. (ie, MyStoreTheme), but the flexibility to set them individually allows for kinda cool theme development for magento. I know I’m gonna take advantage of it. The other 4 values in admin are:
- Layout (located in
app/design/frontend/package/{value}/layout/
)
The XML layout files that your theme uses. - Templates (located in
app/design/frontend/package/{value}/template/
)
These are PHTML files that contain (X)HTML markups and any necessary PHP tags to create logic for visual presentation. - Locale (located in
app/design/frontend/package/{value}/locale/
)
These are simple text documents organized on a per language basis that contain translations for store copy. - Skins (located in
skin/frontend/package/{value}/
)
These are block-specific Javascript and CSS and image files that compliment your (X)HTML.