shopex模板定制服务器定制

通常情况下一个完整的shopex模板包括下面六部分：模板路径是ShopEx48安装目录/themes/进入到某一套模板目录中后，就可以看到该模板的目录和文件结构了

1可重用部分，文件夹中存放着模板各页面的公用部分，扩展名为html，一般是模板的头部和尾部，这两个部分在整个站点中都是相同的，支持smarty语法

2.边框目录，扩展名为html，存放着边框文件，边框是版块的呈现样式，相当于版块的模板，支持smarty语法

4*.html，框架文件，扩展名为html，决定了页面的布局和版块可摆放的区域，是页面的骨架

8borders，边框的描述，这里所列出的信息会被用在后台“修改版块”面板的“版块边框”下拉框中。borders的写法：key为显示在后台的下拉选项，tpl为各边框相对模板目录的边框路径。config，模板中定义的参数，例如一套变色模板，它的颜色可以作为参数写在config中，方便用户在编辑模板时修改。

theme.xml是整个模板中最重要的部分，所有模板的配置信息都是存在这个xml中的，包括板块的位置、配置信息，边框的信息等等。第一次加载模板时，theme.xml中包含的信息被读入数据库，即模板的初始化，之后用户便可以在可视化界面中进行板块的增删改和对原有的板块进行配置。配置信息保存在数据库中，用户可以通过导出模板来下载到最新的带配置信息的theme.xml，通过“恢复默认”来应用新的theme.xml。首页对于一个购物网站来说比较复杂，内页的话相对简单，在ShopEx4.8中，内页都可以用一个框架default.html来表示。页面的头部和尾部都是公用的，所以将它们分离出去，作为独立的html引用到各个框架页面中。注意，头部head内必须有标签，尾部必须有标签，用来输出程序附带的资源，否则内页的一些功能会出现错误。以上面这个模板来说，页面中部布局分为左中右三栏，各栏内部是一些小的功能板块，这些板块的内容和功能是预置的，通过后台可视化编辑来配置。也就是说，ShopEx48模板的制作实际上较少涉及这些功能板块的内容，更多关心的是框架和边框的表现样式。实际制作过程中我们可以将这板块内容以低保真的形式，如图片或文字占位，留待以后细调。首页框架对应的是index.html，代码的写法和平常的html文件是相同的。框架同时也支持smarty语法，写法是。如上图的index.html源码是：

1.建立模板文件夹目录建立一个新模板，需要手工建立一个新文件夹，可以任意命名，模板里必须包含info.xml（模板信息配置文件）、preview.jpg（模板缩略图）、theme.xml（模板信息记录文件，无需修改）。

完成之后系统将会自动判断此文件夹为新模板目录，在后台的模板列表中可看到此模板的名称以及模板缩略图。

这一步和通常的设计稿->页面的过程相同，需要制作者具备基本的html、css等知识，这时的页面代码规整，会给之后的制作带来很大的方便。

这个时候所做的页面可以是低保真的，即仅划分页面的布局，版块的内容可以用均可使用”widget（挂件）“代替，待页面制作完成后，通过后台板块功能嵌入功能后再写入样式。

使用HTML布局方式，将模板分为以下几个部分。每个部分内的元素无需细化，其中含有功能性以及广告、图片、文字等元素，均可使用”widget（挂件）“代替。

注意，头部head内必须有标签，尾部必须有标签，用来输出程序附带的资源，否则内页的部分功能会出现错误。

通过板块功能调用出的内容，其表现形式和风格都是由系统内置CSS制定。而通常我们自己制作的模板往往与系统内置风格有着多多少少的区别。同时也是为了使模板更加独特而需要做的事情。

这一步的过程完全通过css的修改来完成。系统默认调用的是内置css，它的路径是statics文件夹下的framework.css、shop.css。

但是如果我们通过常规方法直接修改这2个系统内置CSS文件，很容易在升级时一并被修改，并无法将模板导出。

这里推荐使用“覆盖法”来更改css的属性，也就是将需要修改的css属性从系统内置CSS文件中，拿到模板目录文件夹内的css文件中，修改过后在页面显示时系统将优先显示此css属性。用此方法达到修改目的。

推荐使用firefox浏览器，和其中的firebug插件，可以快速查询到指定位置的CSS名称和关联情况。

选取可复用部分作为边框，这一步的工作可以放在模板布局时提前做好，因边框也属于外部调用的形式，shopex模板系统将每一个边框文件作为单独的文件以便重复调用。

如果有部分ShopEx本身没有的挂件，可以自行制作新挂件或在原有挂件基础上修改。注意新挂件或者修改后的挂件需改名，勿覆盖系统挂件，以免今后系统升级造成文件丢失。

默认框架输出业务区，承担所有业务流程的功能，也就是说只要一个默认框架default.html就能表示所有功能内页，进入不同的功能内页时，业务区输出不同的预置内容。

如果某个页面需要与其他页面不同，这个时候就可以手工建立一个新的模板框架，这些框架是由系统已经预置好的，只需要选择想要添加的页面类型就可以了。

ShopEx48内置了一套css的框架blueprint，能够很方便的帮助我们进行布局。

px分辨率下满屏的页面宽度一般用960px或950px，以40px为一列可以将宽度分成24列，在css中用.span-1到.span-24来分别定义这些以40px倍增的宽度，这样就从40px到960px覆盖了常用的列宽,每列的实际宽度是宽度减10px，这10px是列与列之间的间隔，最后一列可以加.last，使间隔为
0。

上面这段代码是典型的3列布局，在最外层有一个clearfix用来清除浮动，三列的宽分别是190px，510px，230px，间隔10px。

ShopEx48模板可以认为是布局和板块的组合，布局是骨骼，板块是内容。框架搭好后就是板块的配置。一套模板初始时是由制作者配置好了各种的板块，然后用户可以方便的在可视编辑更改板块的配置。

板块的功能和内容是预置的，它们可以理解为是在框架页面上可插拔的模块，那相应的，框架页面上就要有对应的插槽，这些可以容纳板块的插槽称为板块区，在框架的代码里的标签是，一个板块区能容纳多个竖向排列的板块。

板块区默认是按照框架页html代码中的先后顺序和板块对应的，如果板块区的顺序变动，比如在某个板块区前增加了一个板块区，那么之后的板块都会顺序向前一位挂接在板块区上，导致页面错乱。解决这个问题的办法是给板块区加上特定的id，写法是，这样插槽就能被准确的定位。

除了首页外，其他页面都可以用默认框架default.html，默认框架输出业务区，承担所有业务流程的功能，也就是说只要一个默认框架default.html就能表示所有功能内页，进入不同的功能内页时，业务区输出不同的预置内容。业务区在html代码中的写法是，default.html必须有这个标签。

当然某个功能页也能新建一个框架，框架文件名是系统预置好的，与某个功能页面相对应，只要新建出来一个框架，就自动应用在这个页面上，不同的框架可以带来不同的布局和板块配置。

会员中心和购物车页面需要更大的宽度，因此他们的框架一般与默认框架不同，因此模板一般需要4个框架页，首页index.html、默认页defaut.html、会员中心页member.html、购物车cart.html。

百科词条内容由用户共同创建和维护，不代表百科立场。如果您需要医学、法律、投资理财等专业领域的建议，我们强烈建议您独自对内容的可信性进行评估，并咨询相关专业人士。