《4.1模板编写规范》由会员分享，可在线阅读，更多相关《4.1模板编写规范（18页珍藏版）》请在金锄头文库上搜索。
1、4.1模板编写规范1总体说明 对于一个设计师的页面来说，在淘宝上呈现的页面结构如下：基于这样的页面结构：1. 淘宝要提供一个页面的框架，也就是页面的Layout，设计师设计的页面是Layout中的一部分，如在下面的位置： 2. 模板必需提供全局的CSS，Header和Footer，在任何一个设计的页面都会包含这三者。3. CSS，Header和Footer还会被淘宝其他页面所使用，如评级、店铺留言等。4. 页面包含模块，一部分模块是支持交互的，也就是卖家可以录入一些参数来改变模块的呈现基于这个考虑，模板需要一个全局的配置文件，也就是site.xml，该文件包含了模块的详细信息，由于页面还可能涉
2、及到模块，所以我们还要对各个模块进行定义，模块同时也是代码复用的基本单元，模块的配置文件为module.xml。2模板目录结构 模板目录结构是指模板各个资源目录划分，如下图：目前主要分为已下记录类： 静态资源：都存放在assets目录，同时包括images和stylesheets两个子目录，静态资源引用需要以相对路径为准。 模板文件：也就是模板文件，后缀名为.php或者.vm，依据所选择的模板语言，模板文件包括全局头，全局尾和各个文件的主体。页面文件不能形成子目录。 模块文件：不能包含其他资源文件，如果包含其他资源文件，需要来自淘宝相册的服务，模块主要就是模块的配置文件和其模块主体文件 元信息
3、文件：如xml文件，screenshot文件等，模板为site.xml，模块为module.xml 在SDK中，htdocs可以同时包括多个模板，以不同的目录加以区分，SDK会自动识别这些模板并进行管理，如样例中的template1是模板的名称。 在htdocs的根目录下有一个dcsdk_functions.php的文件，所有SDK提供的函数都会在这里列出；还有一个site.xsd，这个是site.xml的xml schema文件，主要是辅助进行site.xml编辑。参阅：查看目录结构模块化 3模板描述符文件详解 模板是超级旺铺的基础，主要是模板、模板版本、配置和资源这四项，每一个模板都有一个
4、名称为site.xml的描述文件，包含一下信息： 基本信息：如模板语言、名称、描述、作品截图、作者、支持的网站、服务方式等 模板全局信息：如全局css，全局的页面header和footer等 风格信息：模板所包含的风格，都要在元素下进行声明 页面信息：一个模板包含多个页面，每一个页面的具体功能要说明清楚，如店铺的模板页面，那个是首页，那个是详情页等，都需要进行描述 模块信息：该模板所包含的模块以及各个模块的详细信息 参数信息：如果模板、页面和模块需要参数，这个参数是什么类型的，form该如何交互，这些也需要明确 2cd2659796794dbab1e4115dac7facf3 模板-1 Jac
5、ky assets/images/frontpage.png php 2010050901 change log description here header.php footer.php assets/stylesheets/global.css green assets/images/green.jpg /assets/stylesheets/green.css demo green 首页 index.php untitled 宝贝详情页 detail.php 文章页面 article.php 促销页面 onsale.php 出于XML编写的方便，SDK为site.xml提供了XSD，只
6、需要一个XML Editor就可以完成XML校验和相关的代码提示。4模板编写 在模板中的模块都是集中在模板标准目录的modules目录中，可先参看模块编写规范 4.1 引入模块模块有两种类型，分别是系统模块和设计师自定义模块，下面分别说明如何引入系统模块和设计师自定义模块： 引入系统模块 其中include_system_module需要三个参数，第一个为“系统模块简称”，第二个为“系统模块版本”，第三个为domId,这里需要注意的是domId需要在页面内唯一。 引入自定义模块 其中include_local_module有两个参数，第一个”textbox”为模块的名称，第二个为domId,这
7、里需要注意的是domId需要在页面内唯一。4.2 引入片区片区是设计师在页面预留的一块区域，卖家可以在坑里添加模块，具体引入坑的语法如下： shop.topList,version=1.0-common,domId=001); $selfModule=array(id=selfModule,domId=001); $modules=array($topList, $selfModule); echo include_modules(testModules, $modules) echo include_system_module(shop.searchInShop,1.0-common,002
8、) ?其中include_modules包含两个参数，第一个参数是片区对应的名称,第二个参数是片区里面引入的默认模块列表。引入片区需要注意以下几点：1. 片区需要通过“J_TRegion”这个class来标识.2. 片区里面也可以引入系统模块和引入自定义模块 “J_TRegion”外模块引用规范高级模板支持“J_TRegion（坑，片区）”外的模块，但线上目前会存在“片区”外模块丢失的问题；此问题预计在4月中旬修复。片区外的模块的支持，只限于支持单个引用,即只能使用include_system_module, include_local_module进行单个模块引入。使用include_mod
9、ules 引入的模块在编辑的时候将被丢失。 如具体例子如下图所示： “J_Region内模块的引用支持单个模块和多个模块但目前线上使用include_local_module, include_system_module的进行单个引入的模块在编辑都会丢失。此故障预计4月中解决。同时设计师不被鼓励将include_local_module, include_system_module 与include_modules连续使用。设计师更应该遵守不连续使用include_modules的约定。所有连续使用这样的代码引入的模块都可能存在丢失或者莫名奇妙增加的问题。如下图所示4.3 模板中加入模块配置设计师经常会遇到这样的问题：在模板挖了坑，但是没有办法控制坑中能够添加哪些模块。现在在SDK模板中加入了新的配置规则，允许设计师精确配置自己坑中所支持的模块。示例配置如下：site version
