不知到该怎么开始介绍，就直接说了，比如要在商城首页上添加一个自己开发测试用的挂件
1.找到模版文件夹的index.html，路径：themes/mall/default/index.html
自己选一个地方用于摆放挂件的位置，新建div，代码如下：
<div style="height:300px;background-color:gray" area="my" widget_type="area">
<!--{widgets page=index area=my}-->
</div>
然后刷新页面看到灰色div。 这里解释一下，在index.html里会有很多div 都包含area 和widget_type 这两个属性，这就是显示所必须的。
area=“my” ，属性值自定义，widget_type="area" 这个是不变的。这一步我们已经为挂件准备好位置了。
2. 新建一张数据库表test 字段id，name,money然后自己插入三条数据。
ecmall里 每一张表对应一个model
现在新建test表对应的model，命名test.model.php里面内容代码如下：类名采用驼峰命名法，必须继承BaseModel
<?php
class TestModel extends BaseModel{
var $table ="test";
var $prikey ="id";
function getData(){
$tese=m('test);
$test_res=$tese->find(array(
'condtions'=>'id>1',
'limit'=>2,
'order'=>'id desc',
));
return $test_res;
}
}
?>
3.配置文件： data/page_config里应该有两个配置文件，default.gcategory.config.php(商品分类页)和default.index.config.php（商城首页）
如果是新安装的ecmall 打开应该是没有，你可以在首页上先添加两个挂件，然后系统就会自己生成配置文件了。
现在就当是新安装的，既然测试挂件要在首页上，那么自己新建一个default.index.config.php。内容代码如下
<?php
return array (
'widgets' => //第一部分 为挂件定义id值以及一些信息
array (
'_widget_2017' => //注意这个键 （自己定义）
array (
'name' => 'test', //注意这个name 要与你的挂件名一样
'options' =>'我可是你的挂件啊', //这个是描述
),
),
'config' => //第二部分 这个部分的作用就是 my区域将包含id为 _widget_2017的挂件 也就是上面的 name为test 的挂件。
array (
'my' => //这个键对应index.html 挂件摆放位置的div的area属性值
array (
0 => '_widget_2017', // 注意这个值 要和上面键的一样
),
),
);
?>
这样配置文件就写好了。
4.上面做完准备工作，现在开始开发挂件，在external/widgets里 赋值一个已存在的挂件文件夹，改名为test，直接修改里面文件的代码。
一个挂件对应一个文件夹，一个文件夹里面有四个文件：
config.html 配置界面模版
main.widget.php 挂件主程序文件 这个相当于控制器
widget.html 挂件显示模版 显示挂件应该显示的内容
widget.info.php 挂件信息文件 这个就是配置一些说明
打开widget.info.php 里面就是一个数组，简单易懂，想改就改一下，注意 其中最后一个 configurable 如果是false 就代表该挂件不可以被编辑 那么 config.html 就没有用了，这里就先设置成false。
打开main.widget.php 修改类名 还是注意驼峰命名法，简单的代码如下：
<?php
/**
*测试挂件
*
* @param
* @return array
*/
class TestWidget extends BaseWidget
{
var $_name = 'test';
function _get_data()
{
$recom_mod =& m('test');
$data = $recom_mod->getData(); //直接调用test.model里写好的方法，
//$data = $recom_mod->find(array('conditions'=>"id>1")); //调用testmodel继承的basemodel里的方法
// var_dump($data);exit;
return $data;
}
}
?>
这个时候，在test数据表里的内容就已经查到了，$data这个数组就包含了需要的内容
最后再打开widget.html
在模版上循环$data输出就可以了 用到的是smarty的语法，简单的显示一下数据
<!--{foreach from=$widget_data item=goods}-->
<li>
<h3><a href="" target="_blank" title="{$goods.name|escape}">{$goods.name|escape}</a><span>{$goods.money|price}</span></h3>
</li>
<!--{/foreach}-->
至于为什么 main.widget.php里返回的$data在模版页上可以直接用，可能，也许，应该是预先加载了这个模版，谁知道呢，谁让我菜呢，我也很无奈。
5.完成了以上步骤以后，登录后台
点击编辑就回到首页，最上面显示可用挂件，最后一个应该就是新添加的挂件，然后拖动到 回个背景的div里，就ok了。
关于ecmall报错：
这个是不兼容php5.5的原因，可以自行百度。