很多同學(xué)看到別人店鋪的海報(bào)圖是全屏的看著很漂亮,都想在自己的店鋪上也制作這樣的效果,下面廣州淘寶培訓(xùn)來(lái)給各位同學(xué)詳細(xì)的介紹操作步驟吧!
首先同學(xué)們需要準(zhǔn)備一張大海報(bào),一般尺寸是1440像素的寬度就可以了,因?yàn)橛行╋@示器比較大,所以建議可以做大一點(diǎn)。
第一步,在店鋪裝修的時(shí)候新建一個(gè)自定義文件

第二步:在自定義里進(jìn)入源碼編輯模式

第三步:把下面的代碼復(fù)制進(jìn)來(lái)(注意:圖片地址需要改成自己店鋪空間圖片的地址哦?。?br />
以下是全屏大圖代碼:
<div class="J_TWidget" data-widget-config="{effect: fade, circular: true ,contentCls:piao1363617151408fu}" data-widget-type="Tabs">
<div class="piao1363617151408fu" style="height:430px;">
<div data-widget-config="{
contentCls: slide-kun1363617151408content,
triggerCls: slide-kun1363617151408triggers,
navCls: slide-kun1363617151408triggers,
triggerType: mouse,
effect: scrollx,
prevBtnCls:prev,
nextBtnCls:next,
steps: 1,
autoplay: true,
viewSize:[1440],
circular: true
}" data-widget-type="Carousel" class="J_TWidget" style="z-index:10;top:0px;left:-245px;padding:0px;margin:0px;width:1440px;">
<div class="J_TWidget" data-widget-config="{trigger:.first1363617151408trigger,align:{node:.first1363617151408trigger,offset:[0,0],points:[cc,cc]}}" data-widget-type="Popup" style="display:none;">
<div class="prev" style="width:90px;float:left;height:90px;"><img src="http://www.dajie.pro/52/img/2.png" /></div>
<div class="next" style="width:90px;height:90px;margin-left:950px;"><img src="http://www.dajie.pro/52/img/1.png" /></div>
</div>
<div style="height:450px;width:1440px;overflow:hidden;padding:0px;margin:0px;" class="first1363617151408trigger">
<ul class="slide-kun1363617151408content" style="height:450px;width:1440px;padding:0px;margin:0px;">
<li style="width:1440px;height:450px;padding:0px;margin:0px;list-style-type:none;"><a target="_self" href="圖片一鏈接到哪里的地址" style="padding:0px;margin:0px;"><img src="圖片一地址" width="1440px" height="450px" border="0px"></a></li><li style="width:1440px;height:450px;padding:0px;margin:0px;list-style-type:none;"><a target="_self" href="圖片二鏈接到哪里的地址" style="padding:0px;margin:0px;"><img src="圖片二地址" width="1440px" height="450px" border="0px"></a></li>
</ul>
</div>
<ul class="slide-kun1363617151408triggers" style="padding:0px;margin:0px;display:none;">
<li> </li><li> </li>
</ul>
</div>
</div>
</div>
對(duì)于代碼基礎(chǔ)比較差的同學(xué)可能直接用代碼會(huì)不懂添加鏈接地址,所以我們把需要換鏈接的地址用中文來(lái)標(biāo)示了(紅色字樣),同學(xué)們只需要把自己店鋪的圖片的鏈接地址和這個(gè)圖片需要鏈接到的地址替換即可,希望能夠幫到各位親!
首先同學(xué)們需要準(zhǔn)備一張大海報(bào),一般尺寸是1440像素的寬度就可以了,因?yàn)橛行╋@示器比較大,所以建議可以做大一點(diǎn)。
第一步,在店鋪裝修的時(shí)候新建一個(gè)自定義文件

第二步:在自定義里進(jìn)入源碼編輯模式

第三步:把下面的代碼復(fù)制進(jìn)來(lái)(注意:圖片地址需要改成自己店鋪空間圖片的地址哦?。?br />

以下是全屏大圖代碼:
<div class="J_TWidget" data-widget-config="{effect: fade, circular: true ,contentCls:piao1363617151408fu}" data-widget-type="Tabs">
<div class="piao1363617151408fu" style="height:430px;">
<div data-widget-config="{
contentCls: slide-kun1363617151408content,
triggerCls: slide-kun1363617151408triggers,
navCls: slide-kun1363617151408triggers,
triggerType: mouse,
effect: scrollx,
prevBtnCls:prev,
nextBtnCls:next,
steps: 1,
autoplay: true,
viewSize:[1440],
circular: true
}" data-widget-type="Carousel" class="J_TWidget" style="z-index:10;top:0px;left:-245px;padding:0px;margin:0px;width:1440px;">
<div class="J_TWidget" data-widget-config="{trigger:.first1363617151408trigger,align:{node:.first1363617151408trigger,offset:[0,0],points:[cc,cc]}}" data-widget-type="Popup" style="display:none;">
<div class="prev" style="width:90px;float:left;height:90px;"><img src="http://www.dajie.pro/52/img/2.png" /></div>
<div class="next" style="width:90px;height:90px;margin-left:950px;"><img src="http://www.dajie.pro/52/img/1.png" /></div>
</div>
<div style="height:450px;width:1440px;overflow:hidden;padding:0px;margin:0px;" class="first1363617151408trigger">
<ul class="slide-kun1363617151408content" style="height:450px;width:1440px;padding:0px;margin:0px;">
<li style="width:1440px;height:450px;padding:0px;margin:0px;list-style-type:none;"><a target="_self" href="圖片一鏈接到哪里的地址" style="padding:0px;margin:0px;"><img src="圖片一地址" width="1440px" height="450px" border="0px"></a></li><li style="width:1440px;height:450px;padding:0px;margin:0px;list-style-type:none;"><a target="_self" href="圖片二鏈接到哪里的地址" style="padding:0px;margin:0px;"><img src="圖片二地址" width="1440px" height="450px" border="0px"></a></li>
</ul>
</div>
<ul class="slide-kun1363617151408triggers" style="padding:0px;margin:0px;display:none;">
<li> </li><li> </li>
</ul>
</div>
</div>
</div>
對(duì)于代碼基礎(chǔ)比較差的同學(xué)可能直接用代碼會(huì)不懂添加鏈接地址,所以我們把需要換鏈接的地址用中文來(lái)標(biāo)示了(紅色字樣),同學(xué)們只需要把自己店鋪的圖片的鏈接地址和這個(gè)圖片需要鏈接到的地址替換即可,希望能夠幫到各位親!
樂(lè)發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購(gòu)進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購(gòu)信息和超市加盟信息.打造國(guó)內(nèi)超市采購(gòu)商與批發(fā)市場(chǎng)供應(yīng)廠商搭建網(wǎng)上批發(fā)市場(chǎng)平臺(tái),是全國(guó)批發(fā)市場(chǎng)行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。
本文內(nèi)容整合網(wǎng)站:百度百科、知乎、淘寶平臺(tái)規(guī)則
本文來(lái)源: 淘寶店鋪裝修如何實(shí)現(xiàn)全屏大海報(bào)效果?