淘宝店如何加入全屏轮播图片

淘宝店如何加入全屏轮播图片
淘宝店如何加入全屏轮播图片？
- |
- 浏览：5779
- |
- 更新：2014-06-11 11:31
- |
- 标签：淘宝
- 1
- 2
- 3
- 4
- 5
分步阅读
百度经验:jingyan.baidu.com

开淘宝店的朋友，看到很多店铺有各式各样的轮播大图，很高端大气，您是否也想拥有一款属于自己的轮播图呢？今天我就交给大家如何制作全屏轮播图。

百度经验:jingyan.baidu.com
工具/原料

电脑/网络
百度经验:jingyan.baidu.com
方法/步骤

1

登录淘宝店。

登录到您的淘宝店，点击“卖家中心”，进入到店铺管理页面。

步骤阅读

2

进入店铺装修。

点击左侧“店铺装修”进入店铺装修页面。

步骤阅读

3

进入编辑框。

添加好自定义页面后，点击页面编辑，进入正式页面编辑框。点击右上角“编辑”按钮，就可以进入到编辑区域。

步骤阅读

4

导入代码。

进入编辑框后，点击下图画圈的地方，导入以下代码！

以下为代码，请复制手工填入！

<div class="layout grid-m0" data-componentid="231" data-context="bd" data-id="1041995155" data-prototypeid="231" data-widgetid="1041995155">

<div class="col-main">

<div class="main-wrap" data-modules="main" data-width="b950" style="overflow:visible;">

<div class="skin-box tb-module">

<s class="skin-box-tp"></s>

<div class="skin-box-bd clear-fix">

<div class="J_TWidget" data-widget-config="{"effect": "fade", "circular": true ,"contentCls":"tanchudiv"}" data-widget-type="Tabs" style="height:490px;overflow:hidden;">

<div class="tanchudiv" style="height:500px;">

<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;1920px;padding-right:0px;height:500px;border-top:medium none;top:auto;border-right:medium none;padding-top:0px;left:50%;">

<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;1920px;padding-right:0px;height:500px;border-top:medium none;border-right:medium none;padding-top:0px;left:-50%;">

<div class="J_TWidget" data-widget-config="{"contentCls": "taobao-kaidian-com","navCls": "taobaokaidian-com","effect": "scrollx","easing": "easeOutStrong","prevBtnCls":"prev","nextBtnCls":"next","autoplay": true,"viewSize":[1920],"circular": true}" data-widget-type="Carousel">

<div class="J_TWidget" data-widget-config="{"trigger":".ux1920","align":{"node":".ux1920","offset":[-480,0],"points":["cc","cc"]}}" data-widget-type="Popup" style="display:none;">

<div class="prev" style="font-size:100px;cursor:pointer;opacity:0.5;">

<span><img data-ks-lazyload="http://img03.taobaocdn.com/imgextra/i3/75979125/T2.nOlXbpcXXXXXXXX-75979125.png" title="上一屏" /></span>

</div>

</div>

<div class="J_TWidget" data-widget-config="{"trigger":".ux1920","align":{"node":".ux1920","offset":[480,0],"points":["cc","cc"]}}" data-widget-type="Popup" style="display:none;">

<div class="next" style="font-size:100px;cursor:pointer;opacity:0.5;">

<span><img data-ks-lazyload="http://img04.taobaocdn.com/imgextra/i4/75979125/T2d8dTXetdXXXXXXXX-75979125.png" title="下一屏" /></span>

</div>

</div>

<div class="ux1920" style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;overflow:hidden;padding-top:0px;">

<ul class="taobao-kaidian-com" style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;padding-top:0px;">

<li style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;padding-top:0px;">

<span><a data-attr-replace="百度经验百度经验百度经验百度经验" href="http://www.taobao.com/?scene=taobao_shop" style="padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;padding-top:0px;" target="_blank"><img data-ks-lazyload="http://img03.taobaocdn.com/imgextra/i3/683164596/TB2fwioXVXXXXawXpXXXXXXXXXX-683164596.jpg" border="0" height="500" width="1920" /></a></span>

</li>

<li style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;padding-top:0px;">

<span><a data-attr-replace="百度经验百度经验百度经验百度经验" href="http://www.taobao.com/?scene=taobao_shop" style="padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;padding-top:0px;" target="_blank"><img data-ks-lazyload="http://img04.taobaocdn.com/imgextra/i4/683164596/TB288WoXVXXXXXRXpXXXXXXXXXX-683164596.jpg" border="0" height="500" width="1920" /></a></span>

</li>

<li style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;padding-top:0px;">

<span><a data-attr-replace="百度经验百度经验百度经验百度经验" href="http://www.taobao.com/?scene=taobao_shop" style="padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;padding-top:0px;" target="_blank"><img data-ks-lazyload="http://img04.taobaocdn.com/imgextra/i4/683164596/TB2OhSnXVXXXXaiXpXXXXXXXXXX-683164596.jpg" border="0" height="500" width="1920" /></a></span>

</li>

<li style="padding-bottom:0px;margin:0px;padding-left:0px;1920px;padding-right:0px;height:500px;padding-top:0px;">

<span><a data-attr-replace="百度经验百度经验百度经验百度经验" href="http://www.taobao.com/?scene=taobao_shop" style="padding-bottom:0px;margin:0px;padding-left:0px;padding-right:0px;padding-top:0px;" target="_blank"><img data-ks-lazyload="http://img01.taobaocdn.com/imgextra/i1/683164596/TB2CfypXVXXXXcvXXXXXXXXXXXX-683164596.jpg" border="0" height="500" width="1920" /></a></span>

</li>

</ul>

</div>

<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;padding-right:0px;border-top:medium none;border-right:medium none;padding-top:0px;left:50%;">

<div class="footer-more-trigger" style="border-bottom:medium none;border-left:medium none;padding-bottom:0px;padding-left:0px;1920px;padding-right:0px;height:45px;border-top:medium none;top:444px;border-right:medium none;padding-top:0px;left:-960px;">

<ul class="taobaokaidian-com" style="border-bottom:medium none;text-align:center;border-left:medium none;margin:0px auto;1920px;height:45px;border-top:medium none;border-right:medium none;">

<li style="line-height:45px;margin:0px 5px;display:inline;cursor:pointer;">

<span><img data-ks-lazyload="http://img03.taobaocdn.com/imgextra/i3/683164596/TB2fwioXVXXXXawXpXXXXXXXXXX-683164596.jpg" style="border-bottom:#33CCFF 2px solid;border-left:#33CCFF 2px solid;margin:5px 0px;vertical-align:middle;border-top:#33CCFF 2px solid;border-right:#33CCFF 2px solid;" border="0" height="48" width="186" /></span>

</li>

<li style="line-height:45px;margin:0px 5px;display:inline;cursor:pointer;">

<span><img data-ks-lazyload="http://img04.taobaocdn.com/imgextra/i4/683164596/TB288WoXVXXXXXRXpXXXXXXXXXX-683164596.jpg" style="border-bottom:#33CCFF 2px solid;border-left:#33CCFF 2px solid;margin:5px 0px;vertical-align:middle;border-top:#33CCFF 2px solid;border-right:#33CCFF 2px solid;" border="0" height="48" width="186" /></span>

</li>

<li style="line-height:45px;margin:0px 5px;display:inline;cursor:pointer;">

<span><img data-ks-lazyload="http://img04.taobaocdn.com/imgextra/i4/683164596/TB2OhSnXVXXXXaiXpXXXXXXXXXX-683164596.jpg" style="border-bottom:#33CCFF 2px solid;border-left:#33CCFF 2px solid;margin:5px 0px;vertical-align:middle;border-top:#33CCFF 2px solid;border-right:#33CCFF 2px solid;" border="0" height="48" width="186" /></span>

</li>

<li style="line-height:45px;margin:0px 5px;display:inline;cursor:pointer;">

<span><img data-ks-lazyload="http://img01.taobaocdn.com/imgextra/i1/683164596/TB2CfypXVXXXXcvXXXXXXXXXXXX-683164596.jpg" style="border-bottom:#33CCFF 2px solid;border-left:#33CCFF 2px solid;margin:5px 0px;vertical-align:middle;border-top:#33CCFF 2px solid;border-right:#33CCFF 2px solid;" border="0" height="48" width="186" /></span>

</li>

</ul>

</div>

</div>

</div>

</div>

</div>

<ul class="ks-switchable-nav" style="display:none;">

</ul>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

步骤阅读

5

大功告成。

点击确定，大功告成，您的全屏轮播图马上出现了！点击右上角的“发布”马上观看您的轮播图！
相关阅读:
Python中的类（上）
Django REST Framework API Guide 07
Django REST Framework API Guide 06
Django REST Framework API Guide 05
Django REST Framework API Guide 04
Django REST Framework API Guide 03
Django REST Framework API Guide 02
Django REST Framework API Guide 01
Django 详解信号Signal
Django 详解中间件Middleware
原文地址：https://www.cnblogs.com/xiamicomeon/p/4244700.html

淘宝店如何加入全屏轮播图片

淘宝店如何加入全屏轮播图片？

工具/原料

方法/步骤