Blog

magento美工入门之初体验

[gallery] 接触magento已断断续续有半年之久,作为一个美工,一路走来可谓体会颇多,酸甜苦辣了然于心。今天生一念想,决定将自己的所学加以整理,与大家分享,尤其希望对magento新手有所帮助和鼓舞。 我想刚接触magento的朋友都有一样的感受,对magento的文件结构相当迷茫困惑,看看官方下载的magento安装文件,里面共有大小文件300多个……不过没关系,我们美工(magento设计人员)可以先从与自己工作内容相关的部分开始入手。 要建立一个magento网站,美工应该做的是什么呢,从哪里做起呢?主题(theme)——这是我们的工作所在。magento中的主题(theme)是指布局(layout)、模板(template)、区域语言(locale)和皮肤(skin)文件的总和。magento一次可以载入多个主题(theme),所以主题就分成两大类default(默认)theme和non-default(非默认) theme。而说到主题(theme),我们还要了解一个概念是interface,即“界面”,也被称为安装包,它是一组theme的集合。 那么这些专业名称分别代表什么,属于或者说包含哪些文件呢?打开刚刚下载解压的官方magento文件,为大家详细说明: 打开到app/design/frontend/这里,大家可以看到base和default两个文件夹,它们就是interface(界面):base作为基层界面,它包含一个默认theme,内含所有必备文件;default为默认界面,在magento后台,我们可以看到website设置的interface为default。当然,我们也可以建立自己的interface,自己命名。 接着打开default文件夹,即app/design/frontend/default/,大家现在看到的几个文件夹就是主题(theme)了,default便是默认主题,其它几个为非默认主题。每一个interface都会包含有一个default theme。当你指定站点(website)或商店(store)使用某个interface时,这个interface的default theme会被自动加载。如果你需要修改设计,你可以直接修改default theme,也可以创建一个non-default theme,并在这个新建的non-default theme中做你需要做的修改。之所以这样做你的修改会生效是因为magento可以同时加载多个theme,而且default theme总是具有最低的优先级。也正因为如此,default theme需要包含所有的必须的layout,templates和skins文件,而non-default theme则只需要包含我们需要修改的文件,当然也可以包含所有的相关文件。 现在我们以modern这个非默认主题来分别说明布局(layout)、模板(template)、区域语言(locale)和皮肤(skin)文件: 打开app/design/frontend/default/modern/layout/目录,大家看到一组XML文件,这些XML文件是用来定义各个页面的block结构和META信息的。 打开app/design/frontend/default/modern/template/目录,大家看到一组phtml文件,不要觉得陌生,其实它就是(x)html代码里嵌入了php代码,我们只需修改(x)html代码就好了。 打开app/design/frontend/default/modern/locale/目录,大家看到的是en_US文件夹,它里面存放的是翻译文档,用来提供翻译信息。这个我们不怎么用到,可以先放在一边不理。 打开skin/frontend/default/modern/目录,大家会倍感亲切吧,没错,皮肤(skin)文件就是由css、images和js文件组成的。 作为美工,先将这块文件结构了解清楚,再来着手修改模板就容易多了。初次下笔,先写这么多吧,以后我会坚持整理自己的所得分享给大家的。希望能够帮助到大家,祝大家工作顺利、每天更上一层楼~

Words translated by CCJK

146,096,379

Request a call or contact us

  •  

    Call ccjk.support for professional assistance

  •  

    Click Here to leave us a message and be as detailed as possible.

We are Certified

Our Client Satisfaction

rating for previous quarte

4.00
  •  
    Inquiry Form

    Please take few minutes to fill
    inquiry form and get Free Quote

  •  
    Request a Call

    Click to receive Free Call, Our
    Representative will contact you

  •  
    Leave a Message

    Please leave us a message and
    be as detailed as possible

Over 95% of our clients recommend our language services to others


Copyright © CCJK Technologies Co., Ltd. 2000-2017. All rights reserved.
TOP