5. 设计页面
一： 结构化页面
二： 设计页面
1. 引入单个模块
模块有两种： （1）系统模块； （2）自定义模块；
（1）引入系统模块
<?php
echo include_system_module("shop.searchInShop", "1.0-common", "dom-search");
?>
include_system_module 函数接受三个参数， 分别是系统模块的缩量名， 系统模块的版本号， domId。
（2）引入设计师自定义的模块
<?php
echo include_local_module("side_sales", "dom-sales");
?>
函数接受两个参数， 自定义模块的id和domId。
2. 划分页面片区
除了单独引入模块外， 我们可以将页面划分成不同的片区， 片区就意味着卖家可以向其中添加模块， 可以是系统模块也可是是设计师模块。 片区中的模块允许移动， 删除， 编辑。
设计师在页面中定义一个片区的方法很简单， 需要使用class名J_TRegion来划分片区的范围， 同时在 J_TRegion中使用 php系统函数 include_modules来包含片区中的默认模块。
如
<div class="main-wrap J_TRegion"> //.main-wrap {width: 142px}
// J_TRegin 表示一个区域， 卖家可以在店铺装修添加模块
<?php
$main_modules = array(
array('shortname' => 'shop.picRound', 'version' => '1.0-common', domId => "index-01"),
array('id' => 'floor', domId => "index-200"), // 自定义模块
array('shortname' => 'shop.manualSpread', 'version' => '1.0-wangpu', domId => "index-02"),
array('shortname' => 'shop.searchInShop', 'version' => '1.0-common', domId => "index-03"),
array('id' => 'floor', domId => "index-201"), // 自定义模块
array('shortname' => 'shop.itemRecommend', 'version' => '1.0-wangpu', domId => "index-04"),
array('shortname' => 'shop.flashBanner', 'version' => '1.0-common', domId => "index-05"),
array('shortname' => 'shop.forumShow', 'version' => '1.0-common', domId => "index-06"),
array('id' => 'quick_join', domId => "index-202") // 自定义模块
); //定义数组
echo include_modules('main-modules', $main_modules); //显示数组， 呈现内容。
?>
</div>
3. 配置页面信息
编写模块， 撰写页面代码之后， 我们需要对页面进行配置， 以方便渲染引擎识别页面及页面类型， 方便装修系统制定规则。
页面不像模块一样拥有独立的配置文件， 页面的配置信息均集中在site.xml中， 设计师设计的所有的页面类型都需要在site.xml中进行配置。
（1）页面的基础信息配置：
在site.xml 的 pages 节点内， 具体配置每个页面。
<pages>
<page type = "index">
<name>首页</name>
<file>index.php</file>
<thumbnail>assets/images/index.png</thumbnail>
<description>首页</description>
</page>
</pages>
type： 页面的类型， 分别对应淘宝店铺页面所展现出来的类型， 包括： 首页（index）， 宝贝详情页面（detail）， 宝贝列表页面（list）， 文章详情页面（artical）, 文章列表页面（articalList），自定义页面（other）。
name：页面的名称。
file： 页面的php文件路径对应相对当前模板的根目录。
thumbnail: 页面的缩略图。
description： 页面的描述。
（2）配置片区模块规则
通常来说， 配置了以上信息， 设计师在模板中的设计就可以使用了。 但如果我们在页面中设置了片区， 我们想要精确的控制每个片区中能够添加哪些模块， 就需要进一步配置页面片区的具体规则， 来确保指定片区中只能添加指定的模块。 下面来看具体的配置代码：
<rules>
<module shortname = "shop.itemCategory" version = "1.0-common" />
<module shortname = "shop.fileList" version = "1.0-common" />
<module id = "side_help" / >
<module id = "side_sales" />
</rules>
在 page 节点下面， 我们配置以上代码， 就是指定了名为 sub-module的坑中， 支持添加的模块有四个。
