新手三天精通制作shopex模板——不可不看！

由于本人对电子商务网站特别是商城软件特别有兴趣，所以shopex的出场，从4.7版本一直跟踪试用到现在的4.84，并测试了4.85。

         自我感觉，shopex的模板是非常容易上手的。我曾经做过ecshop模板的制作和修改，真的很麻烦，而像shopex这样程序和模板分离，其实理解了shopex模板机制，只要你会做网站美工设计，会Div+Css，一样可以做出一套属于自己的shopex模板。下面是一些心得体会（非本人的）。

         shopex是程序和模板分离的，这样就大大方便了大家可以做出自己漂亮的外观网站，虽然很多地方分离得不够，比如一些核心的业务流程区基本大家就很难修改了，但是大部分还是满足网站基本要求的。

         首先，说说模板下的theme.xml，官方是这么说的，theme.xml是整个模板中最重要的部分，所有模板的配置信息都是存在这个xml中的，包括板块的位置、配置信息，边框的信息等等。第一次加载模板时，theme.xml中包含的信息被读入数据库，即模板的初始化，之后用户便可以在可视化界面中进行板块的增删改和对原有的板块进行配置。配置信息保存在数据库中，用户可以通过导出模板来下载到最新的带配置信息的theme.xml，通过“恢复默认”来应用新的theme.xml。

         这个意思表达得还是比较清楚了，我再详细补充下。

         1. 官方说第一次加载模板时，theme.xml中包含的信息被读入数据库，即模板的初始化。意思就是这个theme数据库只会加载他一次，第二次是不会加载的，除非你强行要恢复默认，数据库才会重新加载读取theme的信息。明白了这点，所以只要加载第一次后，你可以随便修改theme啊，只要你不强行恢复默认的话，theme此时不对数据库任何影响，程序也不会读取和应用到theme。

         2，但是为什么大家建议不要修改theme呢? 首先，修改它没意义。上面说了，第一次加载后theme就等于完成了他的任务了，只要不强行重新加载，theme对系统没任何影响。其次，如果你修改了theme的话，哪天不小心强行恢复默认的话，就会导致某些页面不能输出你被修改的挂件内容。因为theme是告诉数据库在哪个页面哪个位置输出哪个内容。

         3.配置信息保存在数据库中。意思就是你的所有可视化编辑的操作数据和记录全部保持在数据库里面，比如可视化删除了挂件，编辑了挂件，添加了挂件。你在后台代码编辑的时候他会保存到对应的html文件里（是否保存在数据库官方未说）。这点就是要告诉我们，记得一定要数据库配置备份，备份生成的文件就是theme-bak.xml，比如你错误的删除了挂件，这个操作已经记录在数据库里面，你通过点恢复theme-bak.xml，那么数据库里面的这个操作记录就会被擦去，这个挂件就没有删除被恢复。

         3.用户可以通过导出模板来下载到最新的带配置信息的theme.xml，通过“恢复默认”来应用新的theme.xml，也就是上面的意思，通过theme.xml这个文件，方便大家反复擦写数据库记录，实际theme就是数据库配置信息的备份文件。

         3，为什么要引入theme.xml呢？上面说了，可以方便大家备份配置信息反复擦写数据库。其次，就是通用模板的共享。模板包含了2个主要文件，一个是html框架文件，这些是最外层框架布局和大致显示样式，二个是theme.xml配置文件，theme配置文件告诉程序要在哪个页面哪个位置输出哪个内容。比如theme里面全部记录了挂件配置信息，通过theme程序才能真正和模板结合起来输出重要信息内容。html框架文件是死的，theme记录的挂件输出的内容是活的。正是有了theme传递给程序的配置信息，程序才知道什么位置输出什么内容。配置信息最终是要传递到数据库里面，程序才能识别和输出内容。如果没有引入theme，那么这些保存在数据库的配置信息就不方便共享，因为要共享数据库。有了theme，数据库配置信息就可以以文件存在的形式方便大家互相转移共享。

         再说说部分人问的widgets ID中ID的理解。ID就是身份，就是给这个widgets一个唯一的身份，以便程序认识和记住这个widgets输出正确的内容。如果不做ID辨认，程序会自动默认排列顺序，导致输出内容错位，也就是说，你写的ID数据库就会记录这个ID，然后数据库通过这个ID输出你挂件设置的内容。也就是说ID可以随便写，但是不能重复。

======================================================================================

         再说说挂件下模板的修改。比方说首页列表商品下的信息描述，系统默认是名字在上面，价格在下面。如果我们想要 价格在上，商品名在下呢，比如这种效果


         那我们可以修改挂件模板。找到挂件下的goods目录，新建一个a.html文件 复制里面的default.html内容。再来修改a.html内容。先来分析default.html里面的代码.里面<{capture name=titleImg}>里面很多变量和定义，这些是关系到后台挂件设置的内容以及系统输出的内容，我们不能动。我们只要修改模板html代码，就是在以最后一个<{capture 结尾的地方的后面代码，就是输出代码，找到输出的html代码就是以 <div class="itemsWrap <{if $setting.column > 1 &&开头的，我们再找到 设置图片在上的那部分代码
         <{elseif $setting.goodsImgPosition=="top"}>
         <{$smarty.capture.goodsImg}>
         <{$smarty.capture.goodsName}>
         <{$smarty.capture.goodsDesc}>

         这3个smarty的代码就是分别输出图像，商品名字，商品描述的。我们把商品名字和描述互换位置，就可以把价格调整在上面。也可以修改其他HTML代码 达到更多的效果。

         有群友在群问:挂件在哪？怎么添加挂件？怎么加更多的商品列表。
         这个问题是刚刚上手的时候也想了一阵子，弄不明白挂件是干嘛的，关键还是不理解shopex的模板机制，理解了就很好制作和添加挂件了。
         挂件是功能模块，是程序核心，官方是这么说的，关键是怎么理解。
         一套程序是有很多功能的，这很好理解吧，比如首页上的导航模块，他自动列出了你后台添加的栏目，这不就是实现导航功能吗？
首页上的商品列表，他会自动列出你后台添加的商品，这不是实现了商品展示功能吗？？公告区的文章列表，可以自动列出你添加的新闻公告，这不就是功能吗。一套程序就是为了实现各个功能而互相有机结合起来的。

         功能模板之所以叫功能模块，那是因为他紧密结合系统，输出程序最核心的部分，是程序底层代码了，这些不是我们一般人可以修改的，也不是一般人可以随着增加的，他是程序早封装好，为你打包准备好了的。你要做的就是把各个功能漂亮的组合在一起，做个漂亮的网站出来。

         怎么去组合这些功能，那你首先得布局，那你就得会HTML代码了。后台编辑源代码，把需要表现功能的地方一律以widgets ID替换，注意，这个地方要解析下，很多人这里会卡着一下，想不明白。

         你输入 widgets ID 只是告诉程序你在这个地方占了个位置，挖了一个坑，这个时候 ，程序是不知道你这个坑要放啥东西啊，不知道你写的widgets ID是什么意思啊，所以程序在这个地方不会输出任何代码，在后台可视化编辑中，就显示为空白区。你必须到后台可视化编辑里面去添加一个功能附加在这个widgets ID上，这样，数据库就记录了你的操作ID，程序就明白你给这个ID附加的功能，保存后，程序会按照他记录的ID，在widgets上替换 输出程序早封装好的 功能模块，也即大家所谓的挂件。

         也就是说 widgets ID指向的内容是你用ID记录对应着的程序内置的封装的功能模块，是系统内置的，你只有增加和删除的权利。当然你也可以自己写 widgets ，但是一般的人做的只能做哪些简单替换HTML代码的以供后台方便修改的所谓挂件，这些都不和系统核心紧密结合的。

         所以，挂件在哪？？挂件在系列内部自带的封装的。
         怎么添加挂件？ 你首先必须定义一个 widgets ID ，然后去后台可视化编辑把内置功能赋予这个 widgets ID，程序记录后，
         就会在前台页面替换 widgets ID的内容 输出 你赋予的功能代码。
         后台只能看见widgets ID 必须通过程序识别输出后 ，在前台才能看见widgtes的效果（后台可视化编辑实际就是通过了程序输出了）。