Magento是个很强大的php网店建站系统。它将模块与结构皮肤分离得相当清晰,为建站提供很大的灵活性和定制性。但是这点也造成了它上手困难的缺陷。可以说不看相关文档会觉得一头雾水,除了CSS根本不知道上哪里去改HTML结构和修改模块的位置。我使用的是1.6.2.0版。
官方模板设计说明文档:Magento Designer's Guide 下载>>>
官方的这份文档并不是那么容易阅读,我还参考了一下《制作你自己的Magento主题》一文。
不过此文虽好,已是03年前的东西。Magento在后台的管理以及一些文件结构上都有些变化,你可能照着此文去做的话,找不到你想要的东西。但是作为辅助理解官方文档的资料还是相当不错的。
好了,下面以我的理解来诠释一下。
用到的文件结构
官方文档上花了很大篇幅来介绍其文件夹结构,可见理解它是多么重要。不过我觉得丫说得忒繁琐了点。。。
作为一个前端设计者,我们会用到的只有一下两个文件夹(其他的都不用你管):
-
- \app\design\frontend\
- 所有的Module结构逻辑和布局逻辑都在这个文件夹里面哦!
-
- \skin\frontend\
- 你的CSS和CSS用到的图片都在这里哦!
好,我们再来细细分析这两个文件夹中的子文件夹的作用。
- \app\design\frontend
-
- \base
- 存放构成系统最基础的结构。该文件夹的内容极其重要,不能修改和删除。这点会在后面有更详细的说明。
-
- \base\default\etc 这个文件夹目前还没搞清楚到底作何用处。。。里面只有一个widget.xml
- \base\default\layout 用xml文件来存放页面的布局
- \base\default\template 所有module的HTML和内部逻辑都被单独抽离出来以单独的文件夹分别存放
-
- \default
- 系统默认使用的主题结构。默认包含blank/default/iphone/modern四个主题。
-
- \default\default(iphone, modern, or etc.)\locale 用于替换网站的语言版本
-
- \skin\frontend
-
- \base
- 同上,是存放构成系统最基础的CSS样式。该文件夹的内容极其重要,不能修改和删除。这点会在后面有更详细的说明。
-
- \base\default\css 存放CSS样式
- \base\default\images 存放CSS内使用的图片
- \base\default\js 存放javascript文件
-
- \default
- 系统默认使用的主题样式。默认包含blank/default/iphone/modern/blue/french/german四个主题。内部结构跟base文件夹类似。
-
可以看到,这两个文件夹内的文件结构很相似,名称几乎都是一样的,但是不要因此认为它们是有对应关系的。这点在官方文档中重点强调了。它们之间没有对应的关系。
skin文件夹的结构同ASP.NET的App_Theme主题文件夹一样。另外,enterprise版本和communite版本的Magento的文件夹结构会稍有不同。