Magento Template Advices

A couple of days ago i’ve finished my first template for Magento. It is new e-commerce platform with a lot of features. But it takes time to learn how it is working. So here is a couple of advices for whose who will work on creating a template for Magento.

I assume that you use fresh install of Magento.

1. To start you need to create two dirs. Basicly you can just copy them from default theme.
   • copy /app/design/frontend/default/default to /app/design/frontend/default/your_theme (contain layout and html files)
   • copy /skin/frontend/default/default to /skin/frontend/default/your_theme ( contain pics, css, js )
2. To assign theme to a store
   • go to System -> Configuration -> Design tab
   • choose website or store-view level
   • in Current package name, enter the name of the interface in which your new theme resides ( i.e. default)
   • in Default (under Themes heading), enter the name of the new theme ( i.e. your_theme )
3. Disable caching to see changes you make in System -> Cache Management
4. To make your life a bit easier you could enable template path hints to see which modules you need to edit
   • System -> Configuration
   • in the very bottom click on Advanced tab
   • choose your store ( i.e. English ) and turn on hints
5. To edit home page go to CMS -> Manage Pages -> Home page
6. Skeleton templates are in app/design/frontend/your_interface/your_theme/template/page/. Basic skeletons are
   • 1-column
   • 3-column
   • 2-column-right
   • 2-column-left
7. Easy way to display products of your choosing on the home page.
   • Create a category to contain the featured products. Call it e.g. Featured & Set ‘Is Active’ to ‘No’. That way, it won’t display in the catalog menu.
   • After saving the category, please note what ID it gets. You can see it in the last part of the URL. If the URL ends with catalog_category/edit/id/8/, the ID is 8.
   • Add products for the home page to the new category.
   • Edit the Home Page (CMS -> Manage Pages -> Home Page) and add the following content, where 8 should be replaced by your category ID:
     {{block type=”catalog/product_list” category_id=”8″ template=”catalog/product/list.phtml”}}

UPDATE: second part is here