公告:唯艺客户端火爆上线,模板自动安装,国际安全认证~
马上注册,领取百套精美模板(永久免费) 个人中心 | 下载客户端 | 客户服务 | 登录 | 注册
您所在的位置:淘宝装修教程 > 淘宝装修代码

淘宝闪购倒计时装修模板代码生成

2015-04-03 02:56:00

       还有不到一个月的时间就到5.1了,又一个疯狂购物的季节。购物狂欢节自然就少不了打折促销了。在之前的淘宝店铺装修教程中,唯艺提到要想发挥促销的作用,就得制造紧张的气氛。如何制造?放个闪购倒计时吧!没有美工基础,又不懂代码,怎么做?只要你知道把代码复制粘贴去哪里就可以了。

       下面的这个淘宝闪购倒计时装修模板代码主要有几个特效:

1. 每一组倒计时模块都有倒计时。
2. 促销宝贝可以上下切换特效。

       以下是淘宝闪购倒计时装修模板代码生成的效果图。可以看到,整体图片简约大气,即使是促销,也让人看着舒服,大气。




淘宝闪购倒计时装修模板代码生成


<div style="font-family:微软雅黑;color:#555;" class="J_TWidget" data-widget-config="{'navCls':'tab-nav','contentCls':'tab-content','steps':1,'prevBtnCls': 'prev','nextBtnCls': 'next','disableBtnCls': 'disable','circular':true,'effect':'scrolly','easing':'easeOutStrong','duration':0.5,'interval':'4','autoplay':false}" data-widget-type="Carousel"><div class="l_w" style="float:left;width:160px;height:500px;background:#e6ab8a;overflow:hidden"><h3 style="display:block;width:100px;height:110px;font-size:40px;color:#FFF;text-align:center;margin:20px auto 0 auto">今日闪购</h3><ul class="J_TWidget tab-nav" style="text-align:center;font-size:0px;overflow:hidden;zoom:1;line-height:50px;margin:10px 0 0 10px" data-widget-type="Accordion" data-widget-config="{'triggerCls':'tab-panel','panelCls':'tab-panel-go','triggerType':'mouse'}"><li class="tab-panel"style="font-size:14px;margin:0 2px;display:block;outline:none;height:50px;cursor:pointer;overflow:hidden;width:150px;"><span style="background:#fff;height:50px;display:block;border-radius: 25px 0 0 25px;" class="tab-panel-go">新品上市</span><span style="background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB2DL6eaFXXXXaGXpXXXXXXXXXX-770458061.gif) no-repeat 44px 0;height:50px;display:block;color:#FFF;"><span style="font-family:宋体">● </span>新品上市</span></li><li class="tab-panel"style="font-size:14px;margin:0 2px;display:block;outline:none;height:50px;cursor:pointer;overflow:hidden;width:150px;"><span style="background:#fff;height:50px;display:none;border-radius: 25px 0 0 25px;" class="tab-panel-go">爆款推荐</span><span style="background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB2DL6eaFXXXXaGXpXXXXXXXXXX-770458061.gif) no-repeat 44px 0;height:50px;display:block;color:#FFF;"><span style="font-family:宋体">● </span>爆款推荐</span></li><li class="tab-panel"style="font-size:14px;margin:0 2px;display:block;outline:none;height:50px;cursor:pointer;overflow:hidden;width:150px;"><span style="background:#fff;height:50px;display:none;border-radius: 25px 0 0 25px;" class="tab-panel-go">活动专区</span><span style="background:url(http://img02.taobaocdn.com/imgextra/i2/770458061/TB2DL6eaFXXXXaGXpXXXXXXXXXX-770458061.gif) no-repeat 44px 0;height:50px;display:block;color:#FFF;"><span style="font-family:宋体">● </span>活动专区</span></li></ul></div><div style="float:right;width:789px;height:498px;overflow:hidden;background:#fefaf5;border:1px solid #f8ddbd;border-left:none"><ul class="tab-content"><li style="height:500px;width:790px;overflow:hidden;vertical-align: bottom"><div style="float:left;overflow:hidden;text-align:center;width:790px;margin:15px 0" data-widget-config="{'endTime':'2015-01-01 23:59:00','interval':1000,'timeRunCls':'.ad-run','timeUnitCls':{'d':'.day','h':'.hours','m':'.minutes','s':'.seconds'},'minDigit':2,'timeEndCls':'.ad-end'}" data-widget-type="Countdown" class="J_TWidget"><div class="ad-run" style="line-height:40px;"><b style="font-size:15px;">距本场结束剩余</b><span class="day" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>天<span class="hours" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>小时<span class="minutes" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>分<span class="seconds" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>秒</div><div class="ad-end" style="line-height:40px;display: none;"><b style="font-size:24px;">本场活动已经结束了</b></div></div><div style="float:left;width:339px;overflow:hidden;_display:inline;border-right:1px dotted #f8d4aa"><a style="display:block;background:url(http://img02.taobaocdn.com/bao/uploaded/i2/T1WdmGFjVdXXXXXXXX_!!0-item_pic.jpg_310x310.jpg) no-repeat center 0;width:310px;height:310px;overflow:hidden;margin:0 auto;" href="促销宝贝链接" target="_blank"></a><div style="overflow:hidden;margin:10px 0 0 15px;"><span style="margin:10px 0 0 0;float:left;background:#e6ab8a;color:#fff;padding:2px 6px;">闪购价</span><b style="vertical-align: top;float:left;font-size:28px;padding-left:5px;color:#e6ab8a"> 30.00</b><del style="color:#999;float:left;margin:10px 0 0 10px">&yen;30.00</del></div><a style="display:block;text-decoration: none;color:#454545;line-height:22px;overflow:hidden;margin:0 15px;" href="促销宝贝链接" target="_blank"><b>促销宝贝题目-> B128-1</b></a></div><div style="float:left;width:449px;overflow:hidden;_display:inline;border-bottom:1px dotted #f8d4aa;padding-bottom:14px;"><a style="display:block;background:url(http://img01.taobaocdn.com/bao/uploaded/i1/T1yzaGFkxdXXXXXXXX_!!0-item_pic.jpg_180x180.jpg) no-repeat center 0;width:180px;height:180px;overflow:hidden;float:left;margin:0 10px 0 14px;" href="促销宝贝链接" target="_blank"></a><div style="overflow:hidden;"><span style="margin:10px 0 0 0;float:left;background:#e6ab8a;color:#fff;padding:2px 6px;">闪购价</span><b style="vertical-align: top;float:left;font-size:28px;padding-left:5px;color:#e6ab8a"> 30.00</b><del style="color:#999;display:block;clear:both;padding:10px 0">&yen;30.00</del></div><a style="display:block;text-decoration: none;color:#454545;line-height:22px;overflow:hidden;margin-right:20px" href="促销宝贝链接" target="_blank"><b>促销宝贝题目-> B127-1</b></a></div><div style="float:left;width:449px;overflow:hidden;_display:inline;margin-top:14px"><a style="display:block;background:url(http://img01.taobaocdn.com/bao/uploaded/i1/T1cKWuFExXXXXXXXXX_!!0-item_pic.jpg_180x180.jpg) no-repeat center 0;width:180px;height:180px;overflow:hidden;float:left;margin:0 10px 0 14px;" href="促销宝贝链接" target="_blank"></a><div style="overflow:hidden;"><span style="margin:10px 0 0 0;float:left;background:#e6ab8a;color:#fff;padding:2px 6px;">闪购价</span><b style="vertical-align: top;float:left;font-size:28px;padding-left:5px;color:#e6ab8a"> 30.00</b><del style="color:#999;display:block;clear:both;padding:10px 0">&yen;30.00</del></div><a style="display:block;text-decoration: none;color:#454545;line-height:22px;overflow:hidden;margin-right:20px" href="促销宝贝链接" target="_blank"><b>促销宝贝题目-> B158-1</b></a></div></li><li style="height:500px;width:790px;overflow:hidden;vertical-align: bottom"><div style="float:left;overflow:hidden;text-align:center;width:790px;margin:15px 0" data-widget-config="{'endTime':'2015-01-01 23:59:00','interval':1000,'timeRunCls':'.ad-run','timeUnitCls':{'d':'.day','h':'.hours','m':'.minutes','s':'.seconds'},'minDigit':2,'timeEndCls':'.ad-end'}" data-widget-type="Countdown" class="J_TWidget"><div class="ad-run" style="line-height:40px;"><b style="font-size:15px;">距本场结束剩余</b><span class="day" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>天<span class="hours" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>小时<span class="minutes" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>分<span class="seconds" style=" display:inline-block;_zoom:1;_display:inline;overflow:hidden;font-family:impact;width:40px;height:30px;line-height:30px;vertical-align:top;font-size:16px;background:#e6ab8a;margin:0 3px;color:#FFF">0</span>秒</div><div class="ad-end" style="line-height:40px;display: none;"><b style="font-size:24px;">本场活动已经结束了</b></div></div><div style="float:left;width:339px;overflow:hidden;_display:inline;border-right:1px dotted #f8d4aa"><a style="display:block;background:url(http://img02.taobaocdn.com/bao/uploaded/i2/T1WdmGFjVdXXXXXXXX_!!0-item_pic.jpg_310x310.jpg) no-repeat center 0;width:310px;height:310px;overflow:hidden;margin:0 auto;" href="促销宝贝链接" target="_blank"></a><div style="overflow:hidden;margin:10px 0 0 15px;"><span style="margin:10px 0 0 0;float:left;background:#e6ab8a;color:#fff;padding:2px 6px;">闪购价</span><b style="vertical-align: top;float:left;font-size:28px;padding-left:5px;color:#e6ab8a"> 30.00</b><del style="color:#999;float:left;margin:10px 0 0 10px">&yen;30.00</del></div><a style="display:block;text-decoration: none;color:#454545;line-height:22px;overflow:hidden;margin:0 15px;" href="促销宝贝链接" target="_blank"><b>促销宝贝题目-> B128-1</b></a></div></li></ul></div></div><a name="sgmb"></a>



       本闪购倒计时装修代码模板中有三大块:新品上市,爆款推荐和活动专区。由于空间有限,就不为各个专区都列出代码了。如果卖家朋友想在其他模板添加宝贝的,可以在最后的“</b>”前直接复制粘贴以下代码:

<div style="float:left;width:339px;overflow:hidden;_display:inline;border-right:1px dotted #f8d4aa"><a style="display:block;background:url(http://img02.taobaocdn.com/bao/uploaded/i2/T1WdmGFjVdXXXXXXXX_!!0-item_pic.jpg_310x310.jpg) no-repeat center 0;width:310px;height:310px;overflow:hidden;margin:0 auto;" href="促销宝贝链接" target="_blank"></a><div style="overflow:hidden;margin:10px 0 0 15px;"><span style="margin:10px 0 0 0;float:left;background:#e6ab8a;color:#fff;padding:2px 6px;">闪购价</span><b style="vertical-align: top;float:left;font-size:28px;padding-left:5px;color:#e6ab8a"> 30.00</b><del style="color:#999;float:left;margin:10px 0 0 10px">&yen;30.00</del></div><a style="display:block;text-decoration: none;color:#454545;line-height:22px;overflow:hidden;margin:0 15px;" href="促销宝贝链接" target="_blank"><b>促销宝贝题目-> B128-1</b></a></div>


      本文出自唯艺网店装修平台(www.weiyi5.cc,转载请注明出处!

0

相关教程

懒人专区:淘宝模板-免费安装查看更多>

  • 好茶汇聚 素雅浅色 食品保健淘宝模板

    好茶汇聚 素雅浅色 食品保健淘宝模板

    人气:30571
  • 春天衣橱 精品酷黑 潮流男装淘宝模板

    春天衣橱 精品酷黑 潮流男装淘宝模板

    人气:59832
  • 高端优雅 多功能 精品鞋包淘宝模板

    高端优雅 多功能 精品鞋包淘宝模板

    人气:41603
  • 时尚简约 瀑布流 装饰家居淘宝模板

    时尚简约 瀑布流 装饰家居淘宝模板

    人气:35416
  • 活泼绚丽 清新蓝色 户外包包淘宝模板

    活泼绚丽 清新蓝色 户外包包淘宝模板

    人气:39477
  • 日用杂货 清新简约 生活兴趣网店模板

    日用杂货 清新简约 生活兴趣网店模板

    人气:45643
  • 双十一 淘宝活动促销模板 潮流女装

    双十一 淘宝活动促销模板 潮流女装

    人气:33016
  • 旅行眼镜 炫酷欧美 服装配件网店模板

    旅行眼镜 炫酷欧美 服装配件网店模板

    人气:43216