今日分享的这个淘宝店铺装修模板为竖向纵向排列，一行显示一个宝贝的淘宝团购限时抢购打折模板，具有倒计时功能，显示原价、打折价，本模板为在线制作生成。本淘宝团购模板中的标题、原价、现价、宝贝主图、购买地址等内容在线配置后，一键生成对应的淘宝店铺装修代码，无需手动修改代码哦。

模板默认显示3个宝贝，可以添加多个，但是建议不超过20个。另外，默认限时抢购时间结束，请记得修改活动结束时间。

特别提示1：鱼摆摆分享了很多的完整效果淘宝店铺装修免费模板（http://www.yubaibai.com.cn/html/），配合我们的这个店铺模板模块，装修更漂亮哦！

特别提示2：本模板，需要您先淘宝订购开通设置好打折，才能真正意义上具有打折功能，如果您没设置打折，建议看看：《淘宝限时打折怎么设置》

模板预览效果图：

 

这个模板专业版旺铺，基础版旺铺均可以使用哦（基础版的旺铺需要适当变换一下，具体看教程：基础版店铺如何使用基础版950通栏代码装修出专业版950宽模板效果）

（一）淘宝店铺装修模板在线制作地址：http://www.yubaibai.com.cn/tool/tuangou/B174/

（二）淘宝店铺装修模板配置修改说明

（1）设置活动结束时间

模板默认未设置活动结束时间，显示为活动已经结束。大家制作时，勾选时间选择器，设置好您要倒计时的结束时间

（2）配置宝贝标题、购买地址、宝贝主图

（三）淘宝装修模板范例代码

<div style="overflow:hidden;zoom:1;width:950px ; margin:0 auto;font-family:微软雅黑;color:#555" class="tuan"> <ul> <li class="J_TWidget" time="#" data-widget-config="{ 'endTime': '#', 'interval': 1000, 'timeRunCls': '.tuan-run', 'timeUnitCls':{ 'd': '.time-d', 'h': '.time-h', 'm': '.time-m', 's': '.time-s', 'i': '.time-i' }, 'minDigit': 1, 'timeEndCls': '.tuan-end' }" data-widget-type="Countdown" style="box-shadow:0 0 2px 0 #eee;-moz-box-shadow:0 0 2px 0 #eee; -webkit-box-shadow:0 0 2px 0 #eee;background:#FFF;border:1px solid #eee;overflow:hidden;height:338px;"> <div style="float:left;overflow:hidden;width:340px;height:340px"> <div class="tuan-run"> <a href="#" _fcksavedurl="#" target="_blank" style="display:block;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></a> </div> <div class="tuan-end" style="display:none;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></div> </div> <div style="float:right;overflow:hidden;width:608px;padding:20px 0 20px 0;background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB20RYDXVXXXXXhXXXXXXXXXXXX-770458061.gif) no-repeat;"> <div class="tuan-run" style="margin:0 30px;"> <a target="_blank" href="#" _fcksavedurl="#" style=" text-decoration:none;color:#555; display:block; font-size:20px; line-height:30px; height:60px; overflow:hidden;font-weight:700">女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</a> </div> <div class="tuan-end" style="color:#555; display:none; font-size:20px; line-height:30px; height:60px; overflow:hidden;margin:0 30px;"> 女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</div> <div style="height:84px;background:url(http://img04.taobaocdn.com/imgextra/i4/770458061/TB2_pnDXVXXXXccXXXXXXXXXXXX-770458061.gif) no-repeat 0 bottom;margin-top:10px;overflow:hidden;"> <span style=" display:inline-block;padding:0 15px;float:left; margin-top:27px; height:30px; line-height:30px; background:#e62343; text-align:center; color:#FFF">活动价</span> <b style="float:left;color:#FFF;font-size:40px;padding-left:20px; line-height:80px">¥ 67</b> <a href="#" _fcksavedurl="#" target="_blank" style="background:url(http://img03.taobaocdn.com/imgextra/i3/770458061/TB2nd2DXVXXXXakXXXXXXXXXXXX-770458061.gif) no-repeat;width:90px;height:40px;margin:22px 50px 0 0;display:block;float:right;"></a> </div> <ul style=" text-align:center;overflow:hidden;zoom:1; line-height:28px; padding:10px 0 10px 0;font-size:14px;width:510px;margin-left:30px;"> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">原价</span> <span>¥124</span> </li> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">折扣</span> <span>5.4</span> </li> <li style="float:left;width:169px;"> <span style=" display:block">节省</span> <span>¥57</span> </li> </ul> <div class="time-count tuan-run" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:12px;border-top:1px dotted #e5e5e5"> <span style="display:block;height:28px;font-size:14px">距离活动结束还剩</span> <span class="time-d" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">天</span> <span class="time-h" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">小时</span> <span class="time-m" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">分</span> <span class="time-s" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">秒</span> </div> <div class="time-count tuan-end" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:20px;border-top:1px dotted #e5e5e5; display:none"> <b style="color:#15b4e8; font-size:22px; font-family:微软雅黑">下手晚了，活动已结束！</b> </div> </div> </li> <li class="J_TWidget" time="#" data-widget-config="{ 'endTime': '#', 'interval': 1000, 'timeRunCls': '.tuan-run', 'timeUnitCls':{ 'd': '.time-d', 'h': '.time-h', 'm': '.time-m', 's': '.time-s', 'i': '.time-i' }, 'minDigit': 1, 'timeEndCls': '.tuan-end' }" data-widget-type="Countdown" style="box-shadow:0 0 2px 0 #eee;-moz-box-shadow:0 0 2px 0 #eee; -webkit-box-shadow:0 0 2px 0 #eee;background:#FFF;border:1px solid #eee;overflow:hidden;height:338px;"> <div style="float:left;overflow:hidden;width:340px;height:340px"> <div class="tuan-run"> <a href="#" _fcksavedurl="#" target="_blank" style="display:block;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></a> </div> <div class="tuan-end" style="display:none;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></div> </div> <div style="float:right;overflow:hidden;width:608px;padding:20px 0 20px 0;background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB20RYDXVXXXXXhXXXXXXXXXXXX-770458061.gif) no-repeat;"> <div class="tuan-run" style="margin:0 30px;"> <a target="_blank" href="#" _fcksavedurl="#" style=" text-decoration:none;color:#555; display:block; font-size:20px; line-height:30px; height:60px; overflow:hidden;font-weight:700">女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</a> </div> <div class="tuan-end" style="color:#555; display:none; font-size:20px; line-height:30px; height:60px; overflow:hidden;margin:0 30px;"> 女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</div> <div style="height:84px;background:url(http://img04.taobaocdn.com/imgextra/i4/770458061/TB2_pnDXVXXXXccXXXXXXXXXXXX-770458061.gif) no-repeat 0 bottom;margin-top:10px;overflow:hidden;"> <span style=" display:inline-block;padding:0 15px;float:left; margin-top:27px; height:30px; line-height:30px; background:#e62343; text-align:center; color:#FFF">活动价</span> <b style="float:left;color:#FFF;font-size:40px;padding-left:20px; line-height:80px">¥ 67</b> <a href="#" _fcksavedurl="#" target="_blank" style="background:url(http://img03.taobaocdn.com/imgextra/i3/770458061/TB2nd2DXVXXXXakXXXXXXXXXXXX-770458061.gif) no-repeat;width:90px;height:40px;margin:22px 50px 0 0;display:block;float:right;"></a> </div> <ul style=" text-align:center;overflow:hidden;zoom:1; line-height:28px; padding:10px 0 10px 0;font-size:14px;width:510px;margin-left:30px;"> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">原价</span> <span>¥124</span> </li> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">折扣</span> <span>5.4</span> </li> <li style="float:left;width:169px;"> <span style=" display:block">节省</span> <span>¥57</span> </li> </ul> <div class="time-count tuan-run" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:12px;border-top:1px dotted #e5e5e5"> <span style="display:block;height:28px;font-size:14px">距离活动结束还剩</span> <span class="time-d" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">天</span> <span class="time-h" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">小时</span> <span class="time-m" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">分</span> <span class="time-s" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">秒</span> </div> <div class="time-count tuan-end" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:20px;border-top:1px dotted #e5e5e5; display:none"> <b style="color:#15b4e8; font-size:22px; font-family:微软雅黑">下手晚了，活动已结束！</b> </div> </div> </li> <li class="J_TWidget" time="#" data-widget-config="{ 'endTime': '#', 'interval': 1000, 'timeRunCls': '.tuan-run', 'timeUnitCls':{ 'd': '.time-d', 'h': '.time-h', 'm': '.time-m', 's': '.time-s', 'i': '.time-i' }, 'minDigit': 1, 'timeEndCls': '.tuan-end' }" data-widget-type="Countdown" style="box-shadow:0 0 2px 0 #eee;-moz-box-shadow:0 0 2px 0 #eee; -webkit-box-shadow:0 0 2px 0 #eee;background:#FFF;border:1px solid #eee;overflow:hidden;height:338px;"> <div style="float:left;overflow:hidden;width:340px;height:340px"> <div class="tuan-run"> <a href="#" _fcksavedurl="#" target="_blank" style="display:block;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></a> </div> <div class="tuan-end" style="display:none;width:340px;height:340px;background:url(http://img01.taobaocdn.com/bao/uploaded/i2/15183027392359690/T1RIJPFodXXXXXXXXX_!!0-item_pic.jpg_300x300.jpg) no-repeat center center;overflow:hidden"></div> </div> <div style="float:right;overflow:hidden;width:608px;padding:20px 0 20px 0;background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB20RYDXVXXXXXhXXXXXXXXXXXX-770458061.gif) no-repeat;"> <div class="tuan-run" style="margin:0 30px;"> <a target="_blank" href="#" _fcksavedurl="#" style=" text-decoration:none;color:#555; display:block; font-size:20px; line-height:30px; height:60px; overflow:hidden;font-weight:700">女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</a> </div> <div class="tuan-end" style="color:#555; display:none; font-size:20px; line-height:30px; height:60px; overflow:hidden;margin:0 30px;"> 女童打底裤2015春款蕾丝全棉单裤儿童星星小脚裤宝宝裤子</div> <div style="height:84px;background:url(http://img04.taobaocdn.com/imgextra/i4/770458061/TB2_pnDXVXXXXccXXXXXXXXXXXX-770458061.gif) no-repeat 0 bottom;margin-top:10px;overflow:hidden;"> <span style=" display:inline-block;padding:0 15px;float:left; margin-top:27px; height:30px; line-height:30px; background:#e62343; text-align:center; color:#FFF">活动价</span> <b style="float:left;color:#FFF;font-size:40px;padding-left:20px; line-height:80px">¥ 67</b> <a href="#" _fcksavedurl="#" target="_blank" style="background:url(http://img03.taobaocdn.com/imgextra/i3/770458061/TB2nd2DXVXXXXakXXXXXXXXXXXX-770458061.gif) no-repeat;width:90px;height:40px;margin:22px 50px 0 0;display:block;float:right;"></a> </div> <ul style=" text-align:center;overflow:hidden;zoom:1; line-height:28px; padding:10px 0 10px 0;font-size:14px;width:510px;margin-left:30px;"> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">原价</span> <span>¥124</span> </li> <li style="float:left;border-right:1px solid #eee;width:169px;"> <span style=" display:block">折扣</span> <span>5.4</span> </li> <li style="float:left;width:169px;"> <span style=" display:block">节省</span> <span>¥57</span> </li> </ul> <div class="time-count tuan-run" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:12px;border-top:1px dotted #e5e5e5"> <span style="display:block;height:28px;font-size:14px">距离活动结束还剩</span> <span class="time-d" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">天</span> <span class="time-h" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">小时</span> <span class="time-m" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">分</span> <span class="time-s" style=" font-family:impact; font-size:26px;vertical-align:middle;color:#15b4e8; display:inline-block;width:40px;">0</span> <span class="unit">秒</span> </div> <div class="time-count tuan-end" style=" text-align:center;margin:10px 0 0 3px;overflow:hidden;padding-top:20px;border-top:1px dotted #e5e5e5; display:none"> <b style="color:#15b4e8; font-size:22px; font-family:微软雅黑">下手晚了，活动已结束！</b> </div> </div> </li> </ul> </div> <a name="sgmb"></a>

（四）淘宝店铺装修模板安装

（1）专业版旺铺：本模板950宽，直接安装在950自定义模块中。

（2）基础版旺铺：由于淘宝啃爹，阉割了页尾区域，我们只需要在最后一个自定义模块中，插入转化后的淘宝装修代码，即可。具体操作办法，详见教程：基础版店铺如何使用淘宝店铺尾部模板代码

淘宝店铺装修模板在线制作地址：http://www.yubaibai.com.cn/tool/tuangou/B174/

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 yubaibai360@qq.com 举报，一经查实，本站将立刻删除。