【20】淘宝sdk——入门实战之分类导航和店铺公告
有过了很久没有写了，现在淘宝sdk2.0都出来了，但是现在还是测试版，离正式版也进了，后面的我就简单点写，其实都是差不多的知识，注意看我的注释，嗨，本来是想慢慢的写，现在看来注定要烂尾了...
好了，我们开始上正题了，这次我们要做的是750的分类导航和190的店铺公告，其实这里的750分类导航不是很难，和前面做导航的一样的，主要还是在样式这块；190的店铺公告就更不难了，就是输出一个文本。
============================================================================================
首先：我们要先在控制台上创建这2个模块，再在index.php中写好布局（750&190分栏）和模块
不说废话了，上代码
<!-- 750&190分栏 -->
<div class="layout grid-m0s5">
<div class="col-main">
<div class="fenlei_modules main-wrap J_TRegion">
<?php $fenlei_modules = array(
array('id' => 'fenlei01', domId => "fenlei_01"), // 750分类导航
);
echo include_modules('fenlei_modules', $fenlei_modules);
?>
</div>
</div>
<div class="gonggao_modules col-sub J_TRegion">
<?php $gonggao_modules = array(
array('id' => 'gonggao02', domId => "gonggao_02"), // 190店铺公告
);
echo include_modules('gonggao_modules', $gonggao_modules);
?>
</div>
</div>
这里写好了，我们就开始写我们的750分类导航的模块了
打开系统给我们创建的模块fenlei_01.php，写上下面的代码
<div class="box J_TBox" <?php echo $_MODULE_TOOLBAR ?>>
<div class="fenlei">
<div class="hd" style="display:<? echo $_MODULE[fenlei_0]?>;">
<div class="left"><? echo $_MODULE[fenlei_1]?></div>
<div class="right">
<a href="<?php echo $uriManager->searchURI(); ?>" target="_blank">查看全部分类>></a>
<a href="<?php echo $uriManager->searchURI(); ?>&orderType=_hotsell" target="_blank">按销量</a>
<a href="<?php echo $uriManager->searchURI(); ?>&orderType=_newOn" target="_blank">按新品</a>
<a href="<?php echo $uriManager->searchURI(); ?>&orderType=price" target="_blank">按价格</a>
<a href="<?php echo $uriManager->searchURI(); ?>&orderType=_hotkeep" target="_blank">按收藏</a>
</div>
</div>
<div class="infenlei">
<?php
$json = $_MODULE['fenlei_2'];
/*通过PHP函数解析json数据生成JSON数组*/
$jsonObject = json_decode($json);
for($n = 0; $n <4; $n++){
echo '<div class="bd">';
echo '<ul>';
$shopCategory = $shopCategoryManager->queryById($jsonObject[$n]->{rid});// 根据json对象获取rid属性的属性值即得到一级类
$big_url = $uriManager->shopCategoryURI($shopCategory); //临时记录大分类URL,无子分类时用
$big_name = $shopCategory->name; //临时记录大分类名,无子分类的时候显示
if($shopCategory){
echo '<h4><a href="'.$big_url.'" target="_blank">'.$big_name.'</a></h4>';
}else{
echo '<h4><a href="#" target="_blank">选择大分类'.$n.'</a></h4>';
}
echo '<li>';
/*二级类目是通过','分隔的字符串（一定注意是半角逗号字符）*/
$array = explode(",",$jsonObject[$n]->{childIds});
foreach($array as $id){
$subShopCategory = $shopCategoryManager->queryById($id);
$url = $uriManager->shopCategoryURI($shopCategory);//子分类链接
$name = $subShopCategory->name;//子分类名称
if($subShopCategory){
echo '<a href="'.$url.'" target="_blank">'.$name.'</a>|';
}else{
for($m = 0; $m <8; $m++){
echo '<a href="#" target="_blank">选择小分类'.$m.'</a>|';
}
}
}
echo '</li>';
echo '</ul>';
echo '</div>';
}
?>
</div>
</div>
</div>
再打开，module.xml写我们要的功能
<?xml version="1.0" encoding="GBK" standalone="yes"?> <module xsi:noNamespaceSchemaLocation="http://www.cnblogs.com/../module.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <id>fenlei01</id> <name>分类导航</name> <file>fenlei01.php</file> <thumbnail>assets/images/index.png</thumbnail> <description>分类导航</description> <requiredCache>true</requiredCache> <parameters> <param label="请选择┏" formType="select" readonly="false" description="默认为隐藏" ptype="text" name="fenlei_0"> <option selected="selected" value="block">显示标题栏</option> <option value="none">隐藏标题栏</option> </param> <param label="自定义标题名称┗" formType="text" readonly="false" description="请输入自定义标题名称" ptype="text" name="fenlei_1"> 750分类导航标题 </param> <param label="选择四个大分类" formType="categoryForm" readonly="false" description="点击此处添加分类" ptype="category" name="fenlei_2"></param> </parameters> </module>
样式我们等下写，现在我们来写公告模块，
打开系统给我们创建的gonggao02.php
<div class="box J_TBox" <?php echo $_MODULE_TOOLBAR ?>>
<div class="gonggao02">
<div class="top">
<? echo $_MODULE[gonggao02_1]?>
</div>
<div class="ingonggao02">
<div class="txt"><? echo $_MODULE[gonggao02_2]?></div>
<div class="share">
<p>分享本店铺到：</p>
<?php
echo '<div class="jiathis clear">';
echo '<dl>';
echo '<dd class="sf s1"><form action="http://www.jiathis.com/send/?webid=taobao&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="淘江湖"></form></dd>';
echo '<dd class="sf s2"><form action="http://www.jiathis.com/send/?webid=tsina&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="新浪微博"></form></dd>';
echo '<dd class="sf s3"><form action="http://www.jiathis.com/send/?webid=tqq&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="腾讯微博"></form></dd>';
echo '<dd class="sf s4"><form action="http://www.jiathis.com/send/?webid=qzone&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="QQ空间"></form></dd>';
echo '<dd class="sf s5"><form action="http://www.jiathis.com/send/?webid=renren&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="人人网"></form></dd>';
echo '<dd class="sf s6"><form action="http://www.jiathis.com/send/?webid=kaixin001&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="开心网"></form></dd>';
echo '<dd class="sf s7"><form action="http://www.jiathis.com/send/?webid=t163&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="网易微博"></form></dd>';
echo '<dd class="sf s8"><form action="http://www.jiathis.com/send/?webid=tsohu&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="搜狐微博"></form></dd>';
echo '<dd class="sf s9"><form action="http://www.jiathis.com/send/?webid=douban&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="豆瓣"></form></dd>';
echo '<dd class="sf s10"><form action="http://www.jiathis.com/send/?webid=hi&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="百度空间"></form></dd>';
echo '<dd class="sf s11"><form action="http://www.jiathis.com/send/?webid=jiathis&url=http://shop'. $_shop->id .'.taobao.com&title='.$_shop->title.'" method="post" target="_blank"><input type="submit" value="" title="点击分享到更多"></form></dd>';
echo '</dl>';
echo '</div>';
?>
</div>
</div>
</div>
</div>
现在我们写好了，就写功能吧，打开module.xml文件
<?xml version="1.0" encoding="GBK" standalone="yes"?> <module xsi:noNamespaceSchemaLocation="http://www.cnblogs.com/../module.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <id>gonggao02</id> <name>网店公告</name> <file>gonggao02.php</file> <thumbnail>assets/images/index.png</thumbnail> <description>网店公告</description> <requiredCache>true</requiredCache> <parameters> <param label="自定义标题名称2┏" formType="text" readonly="false" description="请输入自定义标题名称2" ptype="text" name="gonggao02_1"> 店铺公告 </param> <param label="公告内容┗" formType="textarea" readonly="false" description="公告内容" ptype="text" name="gonggao02_2"> 欢迎您光临本店，祝您在本店购物愉快！本店商品全部实物拍摄，产品质量保障，请你在收到宝贝后，咨询检查，确认没有问题后签收。 </param> </parameters> </module>
好了，这2个模块我们都写好了，最后我们来弄弄css吧，没有好看的样式怎么行呢，呵呵。
/*分类导航*/
.fenlei{width:100%;}
.fenlei .hd{width:748px;height:35px;line-height:35px; border:#e6e6e6 solid 1px;border-bottom:#ff8808 solid 3px;overflow: hidden;}
.fenlei .hd .left{float:left;font-size:14px;font-weight:bold;padding-left:10px;color:#ff8808;}
.fenlei .hd .right{float:right;padding-right:10px;font-size:13px;color:#999;}
.fenlei .hd .right a{margin-left:10px;}
.infenlei {width:748px;border-right:#e6e6e6 solid 1px;border-left:#e6e6e6 solid 1px;border-top:#e6e6e6 solid 1px;overflow:hidden;background:#FFFFFF;}
.infenlei .bd{width:728px;border-bottom:#e6e6e6 solid 1px;padding:10px;color:#4E4E4E;}
.infenlei .bd ul h4{float:left;width:120px;height:30px;line-height:30px;background-color:#EFEFEF;text-align:center;font-size:13px;}
.infenlei .bd ul li{float:left;width:608px;height:30px;line-height:30px;overflow:hidden;}
.infenlei .bd ul li a{padding:0 5px;}
/*[190]店铺公告*/
.gonggao02{width:100%;}
.gonggao02 .top{width:188px;height:35px;line-height:35px; border:#e6e6e6 solid 1px;border-bottom:#ff8808 solid 3px;overflow: hidden;font-size:14px;font-weight:bold;color:#ff8808;text-align:center;}
.ingonggao02 { width: 168px;height:183px; border: 1px solid #e6e6e6;margin-bottom:10px;color:#4E4E4E;padding:10px;}
.ingonggao02 .txt {border-bottom:#e6e6e6 solid 1px;margin-bottom:12px;padding-bottom:9px;}
.ingonggao02 .share {height:70px;width:140px;margin:0 auto;}
.ingonggao02 .share form {margin-top:5px;}
/*jiathis分享图标代码*/
.jiathis dl dd {float: left;margin: 0;padding: 0;}
.jiathis .sf input {background: url(../images/gonggao/jiathis.gif) no-repeat 0 0 transparent;border: 0 none;cursor: pointer;height: 16px;margin-right: 5px;width: 16px;}
.jiathis .s1 input {background-position: 0 0;}
.jiathis .s2 input {background-position: 0 -23px;}
.jiathis .s3 input {background-position: 0 -46px;}
.jiathis .s4 input {background-position: 0 -69px;}
.jiathis .s5 input {background-position: 0 -92px;}
.jiathis .s6 input {background-position: 0 -115px;}
.jiathis .s7 input {background-position: 0 -138px;}
.jiathis .s8 input {background-position: 0 -161px;}
.jiathis .s9 input {background-position: 0 -184px;}
.jiathis .s10 input {background-position: 0 -207px;}
.jiathis .s11 input {background-position: 0 -230px;}
都弄好了，现在我们看下效果图吧：
=====================================================================================================
素材：
好了这些才算全弄好了