一、全局設置
全局設置，可以把全局模塊加到header裏面。因爲，淘寶在J_TWidget的div裏都會在debug的時候在J_TBox里加上一個ui-dd樣式，而在非debug的時候是沒有ui-dd樣式的，所以利用這個特點，可以把全局模塊設置成正常瀏覽不可見，debug可見的特性。
區域的具體代碼：
<div class="layout
grid-m cloudcome"><div class="J_TRegion"><?echo include_local_module('global','global-1');?></div></div>global模塊的具體代碼：<div class="J_TBox
global_cloudcome" <? echo $_MODULE_TOOLBAR;?>><div class="setting" style="height:40px;"><center>★請不要在其他地方添加此模塊!全局設置參數,保存後刷新頁面,如有不明請諮詢我們.★</center><?//全局參數處理與輸出?></div></div> |
其CSS樣式爲：
.cloudcome{height:40px; overflow:hidden;}.cloudcome .global_cloudcome{visibility: hidden; position:relative; background-color:#6E9B07; height:40px;}.cloudcome .ui-dd{display:block; visibility: visible;}.cloudcome .ui-dd .ds-bar-del{display:none;width: 0px;height: 0px;visibility: hidden;}.cloudcome .setting{ position:relative; width:100%; height:40px; color:#fff; font-size: 18px; line-height:40px;} |
二、約定俗稱
1、模塊的命名
模塊的命名在20字符以內，其名稱爲cloud99_slide_950，第一個參數爲模塊的類別【baby（寶貝列表）、focus（焦點圖）、float（懸浮）、article（文章列表）、banner（店鋪招牌+導航）、foot（店鋪尾部）、search（搜索）等】，第二個參數爲組件名，第三個參數爲寬度【950、750、630、310、190、auto（100%寬度）、x（沒有固定寬度）】。
也許這不是最好的命名方式，但隨着模塊更深入的開發和創新，將會出現更加明智、更加科學、更加有效的命名方式。
2、Css寫法
在測試模塊的時候，強烈推薦使用模塊化CSS來管理各個模塊，而在最後組裝成一個模板的時候，就需要把模塊化CSS拆開。這是因爲這裏存在着一個BUG，至少在SDK的1.17版本沒有被修復。BUG是這樣的：只要當有模塊化CSS的模塊數量大於2，就不能在debug的時候顯示調試信息。而且，存在另外一個BUG，那就是模塊化CSS裏面，不能涉及標籤的background-image的CSS樣式，否則就不能加載所有CSS。
這裏附帶幾個常用的CSS：
（1）、濾鏡（所有都支持）：
opacity:0.75;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75); |
（2）、圓角（HTML5，ie9以下瀏覽器不支持）：
border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px; |
（3）、ie獨有的CSS標識：
下劃線：_border【ie6以下版本】
星號：*border【ie7以下版本】
星號加號：*+border【ie7】
[詳細內容:http://blog.163.com/koala8211@126/blog/static/411592532010452755415/ ]
在這裏不得不說的是，爲了買家的購物安全和快捷需求，爲了適應社會前進的方向，我們作爲前端開發er，不能總是爲了去兼容一些已經被淘汰的東西而浪費精力，而羈絆了我們去開發更完美的顯示效果。這也是督促中國消費者改變一成不變的慵懶習慣，積極的擁抱新科技、新成果。
3、模塊結構
一直推薦模塊的結構是這樣的：第一層爲box，添加一個沒有樣式的div，其目的就是爲了便於debug的時候計算模塊內容的高度（值得一提的是，如果debug的時候不能獲得高度，我們需要注意這個空白的div是否被添加），然後裏層添加兩個div，第一個是hd，第二個是bd，按照官方模塊的書寫方式，便於模塊的全局管理。
其主要的結構如下：
<div class="J_TBox
box tshop-um tshop-um-image1_popup_750" <? echo $_MODULE_TOOLBAR;?>><div><?php$title=$_MODULE['title'];if($title!=''){echo '<div><h3><span>'.$title.'</span></h3></div>';}/*=============================================*/$html='<div></div>';echo $html;?></div></div> |
還有一點需要說明的就是，在$html裏，強烈推薦把所有的bd裏面的DOM都書寫在一起，最後再echo出來，而不是在中間echo，更不推薦在for循環、foreach循環裏echo。
三、開放接口
淘寶的開發接口比較少，但基本可以滿足SDK高級模板的開發。主要用到的接口是寶貝類、分類類兩類。
1、寶貝類接口
首先需要寶貝的id，寶貝id可以通過直接獲取id、間接通過分類、關鍵詞、排行3種方式獲得，其主要代碼爲：
【XML】
<param label="◆-->寶貝的獲取方式" formType="select" readonly="false" description="1" ptype="number" name="method"><![CDATA[]]><option value="1">█方式1-->自動獲取寶貝(默認)</option><option value="2">▲方式2->根據分類獲取寶貝</option><option value="3">★方式3->根據關鍵字獲取寶貝</option><option value="3">▼方式4->手動選擇寶貝</option></param><param label="█方式1-->自動獲取(無參數)" formType="text" readonly="false" description="留空即可" ptype="number" name="method_1"><![CDATA[]]></param><param label="▲方式2-->選擇分類(1個分類,如果選擇了多個分類優先讀取第1個分類)" formType="categoryForm" readonly="false" description="choose" ptype="category" name="method_2"/><param label="★方式3-->輸入關鍵字(1個關鍵字)" formType="textarea" readonly="false" description="1個關鍵字" ptype="textarea" name="method_3"><![CDATA[關鍵字1]]></param><param label="▼方式4-->選擇寶貝(可以選擇多個寶貝)" formType="itemForm" readonly="false" description="choose" ptype="item" name="method_4"/><param label="◆-->寶貝排序方式" formType="select" readonly="false" description="select" ptype="text" name="sort"><![CDATA[]]><option value="hotsell">以熱銷寶貝升序排序(默認)</option><option value="_hotsell">以熱銷寶貝降序排序</option><option value="ceofp">以寶貝人氣升序排序</option><option value="_ceofp">以寶貝人氣降序排序</option><option value="price">以寶貝價格升序排序</option><option value="_price">以寶貝價格降序排序</option><option value="newOn">以最新上架寶貝升序排序</option><option value="_newOn">以最新上架寶貝降序排序</option><option value="HotKeep">以熱門收藏升序排序</option><option value="_HotKeep">以熱門收藏降序排序</option></param><param label="◆-->寶貝的數量" formType="text" readonly="false" description="大於0的數值,最多20" ptype="number" name="num"><![CDATA[8]]></param><param label="◆-->寶貝的計數單位" formType="text" readonly="false" description="比如:個/件/箱/張/片/筆等" ptype="text" name="unit"><![CDATA[筆]]></param> |
【php】
$method =$_MODULE['method']; //寶貝獲取方式,1=自動,2=分類,3=關鍵字,4=手動,5=半自動$method_1 =$_MODULE['method_1'];$method_2 =$_MODULE['method_2'];$method_3 =$_MODULE['method_3'];$method_4 =$_MODULE['method_4'];$method_5 =$_MODULE['method_5'];$sort =$_MODULE['sort']; //寶貝排序方式$num =$_MODULE['num']; //寶貝的數量//function ids($items){$k=0;foreach($items as $item){$ids[$k]=$item->id;$k++;}return $ids;}//if($method==1)//自動{$items=$itemManager->queryByKeyword('
',$sort,$num);$ids=ids($items);}else if($method==2){$category=json_decode($method_2);if(count($category)==0)//沒有選擇分類{$items=$itemManager->queryByKeyword('
',$sort,$num);$ids=ids($items);}else//選擇了分類{$cat_ids=array();// $items = $itemManager-> queryByCategory ($categoryId,"hotsell",10);/foreach($category as $jsonObject){$category_1 = $shopCategoryManager->queryById($jsonObject->{rid});// echo 'id1='.$category_1->id;// echo '<br>';$cat_ids[]=$category_1->id;$subcategory=explode(",",$jsonObject->{childIds});foreach($subcategory as $subcategoryid){$category_2 = $shopCategoryManager->queryById($subcategoryid);// echo 'id2='.$category_2->id;// echo '<br>';$cat_ids[]=$category_2->id;}}// $k=count($cat_ids)-1;$cat_id=$cat_ids[0];$items = $itemManager->
queryByCategory ($cat_id,$sort,$num);$ids=ids($items);// var_dump($cat_ids);}}else if($method==3)//關鍵字{$words=trim($method_3);$items=$itemManager->queryByKeyword($words,$sort,$num);$ids=ids($items);}else if($method==4)//手動{$ids=$method_4;} |
在獲得寶貝id之後，可以循環ids獲得各個id而讀取寶貝相關信息，其主要代碼爲
foreach($ids as $key=>$value){$item=$itemManager->queryById($value);//查詢寶貝$link =$uriManager->detailURI($item); //寶貝的鏈接$price =$item->price; //寶貝的價格$name =$item->title; //寶貝的標題$sold =$item->soldCount; //寶貝的銷量$collected =$item->collectedCount
; //寶貝的收藏量$pic =$item->getPicUrl(160); //寶貝圖片【有40、60、80、100、120、160、220、310、620】} |
2、分類類接口
分類的獲取和寶貝類似，其主要代碼如下：
【XML】
<param label="獲取分類方式" formType="select" readonly="false" description="選擇獲取分類方式" ptype="number" name="method"><![CDATA[]]><option value="0">自動獲取分類(默認/建議)</option><option value="1">手動選擇分類</option></param> |
【PHP】
if($_MODULE['method']==0)//auto自動獲取所有分類{ //1級分類 $category_arr=$shopCategoryManager->queryAll(); foreach($category_arr as $shopCategory) { $name1=$shopCategory->name; $href1=$uriManager->shopCategoryURI($shopCategory); //2級分類 $subcategory_arr=$shopCategoryManager->querySubCategories($shopCategory->id); foreach($subcategory_arr as $shopCategory) { $name2=$shopCategory->name; $href2=$uriManager->shopCategoryURI($shopCategory); } }}else//1===>手動分類{ //1級分類 $category_arr=json_decode($_MODULE['hand']); foreach($category_arr as $jsonObject) { $category_1 = $shopCategoryManager->queryById($jsonObject->{rid}); $name1=$category_1->name; $href1=$uriManager->shopCategoryURI($category_1); //2級分類 $subcategory_arr=explode(",",$jsonObject->{childIds}); foreach($subcategory_arr as $subcategoryid) { $category_2 = $shopCategoryManager->queryById($subcategoryid); $name2=$category_2->name; $href2=$uriManager->shopCategoryURI($category_2); } }} |
3、其他接口
（1）、店鋪收藏：
$link_fav=$uriManager->favoriteLink(); |
（2）、店鋪首頁：
$pageLinks=$shopManager->getShopPageLinks();$link_home=$pageLinks[0]->href; |
（3）、寶貝收藏【未開放】：
|
|
（4）、掌櫃說【未開放】：
|
|
（5）、旺旺客服【半開放】
//客服分流$link_wangwang='http://amos.im.alisoft.com/getcid.aw?v=2&uid='.$id.'&site=cntaobao&s=2&groupid=0&charset=utf-8';//客服不分流$link_wangwang='http://www.taobao.com/webww/ww.php?ver=3&touid='.$id.'&siteid=cntaobao&status=2&charset=utf-8'; |
（6）、購物車【未】
http://cart.taobao.com/my_cart.htm |
（7）、我的訂單【未】
http://trade.taobao.com/trade/itemlist/list_bought_items.htm |