天猫海报装修整屏代码-淘宝首页的全屏海报装修方法

<div style="height:450px;">

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

<div class="footer-more-trigger" style="left:-960px;top:auto;border:none;padding:0;">

<a href="这是产品的连接地址" target="_blank">

<img src="这是全屏海报的连接地址" width="1920px" height="450px" border="0" />

</a>

</div>

</div>

</div>

装修方法步骤如下:

1,进入装修后台的图片空间,将你选择要轮播的海报上传上去。

2,打开之前在网上下载的那段轮播海报代码。

选择编辑——替换,将原代码中的500全部替换为海报高度,然后将这段代码复制下来。

3,进入店铺装修页面,在主屏的第一屏海报位置新建一个自定义页面,点击,切换到代码模式。

4,将之前复制的那段代码黏贴上去。找到代码中的图片链接部分。

5,再次进入图片空间,将大图海报的链接地址复制下来。替换到原来的代码的图片链接位置。

6,代码都改完之后,按回到图片模式,这时候会发现什么图都看不到。不用担心,点击预览或者发布,就能看到全屏轮播海报效果啦。

附上全屏轮播海报代码:

<div class="J_TWidget" data-widget-config="{'effect': 'fade', 'circular': true ,'contentCls':'piao1365065449925fu'}" data-widget-type="Tabs">

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

<div class="J_TWidget" data-widget-config="{

'contentCls': 'slide-kun1365065449925content',

'triggerCls': 'slide-kun1365065449925triggers',

'navCls': 'slide-kun1365065449925triggers',

'triggerType': 'mouse',

'effect': 'scrollx',

'prevBtnCls':'prev',

'nextBtnCls':'next',

'steps': 1,

'autoplay': true,

'viewSize':[1920],

'circular': true

}" data-widget-type="Carousel" style="margin: 0px; padding: 0px; left: -180px; top: 0px; width: 1920px; z-index: 10;">

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

<div class="prev" style="width: 90px; height: 90px; float: left;">

<img data-ks-lazyload="

!!" /></div>

<div class="next" style="width: 90px; height: 90px; margin-left: 950px;">

<img data-ks-lazyload="

!!" /></div>

</div>

<div class="first1365065449925trigger" style="margin: 0px; padding: 0px; width: 1920px; height: 500px; overflow: hidden;">

<ul class="slide-kun1365065449925content" style="margin: 0px; padding: 0px; width: 1920px; height: 500px;">

<li style="margin: 0px; padding: 0px; width: 1920px; height: 500px; list-style-type: none;">

<a href="

/?&&scene=taobao_shop

" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="

!!" height="500" width="1920" /></a></li>

<li style="margin: 0px; padding: 0px; width: 1920px; height: 500px; list-style-type: none;">

<a href="

/?&&scene=taobao_shop

" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="

!!" height="500" width="1920" /></a></li>

<li style="margin: 0px; padding: 0px; width: 1920px; height: 500px; list-style-type: none;">

<a href="

/?&&scene=taobao_shop

" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="

!!" height="500" width="1920" /></a></li>

<li style="margin: 0px; padding: 0px; width: 1920px; height: 500px; list-style-type: none;">

<a href="

/?&&scene=taobao_shop

" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="

!!" height="500" width="1920" /></a></li>

</ul>

</div>

<ul class="slide-kun1365065449925triggers" style="margin: 0px; padding: 0px; display: none;">

<li>

</li>

<li>

</li>

<li>

</li>

<li>

</li>

</ul>

</div>

</div>

</div>

集市旺铺:

<!--

·1 此全屏代码默认尺寸为 1920x600 像素

·2 可放置各种元素在 “内容放置区”,例如<table>、<img>……

-->

<!-- 1920全屏 -->

<div style="height:600px; overflow:hidden;">

  <div class="footer-more-trigger" style="height:auto; width:auto; top:auto; left:50%; border:none; padding:0; z-index:9;">

    <div class="footer-more-trigger" style="height:auto; width:auto; top:auto; left:-960px; border:none; padding:0; z-index:9;"> 

      <!-- 内容放置区 -->

      <!-- 内容放置区 END --> 

    </div>

  </div>

</div>

<!-- 1920全屏 END -->

天猫旺铺:

<!--

·1 此全屏代码默认尺寸为 1920x600 像素

·2 可放置各种元素在 “内容放置区”,例如<table>、<img>……

-->

<!-- 1920全屏 -->

<div style="height:600px; overflow:hidden;">

  <div class="sn-simple-logo" style="height:auto; width:auto; top:auto; left:50%; border:none; z-index:9;">

    <div class="sn-simple-logo" style="height:auto; width:auto; top:auto; left:-960px; border:none; z-index:9;"> 

      <!-- 内容放置区 --> 

      <!-- 内容放置区 END --> 

    </div>

  </div>

</div>

<!-- 1920全屏 END -->