淘寶全屏輪播海報製作

淘寶店鋪首頁全屏輪播海報顯得很大氣,有木有,但是很多製作軟體是要花錢的,這裡給大家何自己製作全屏海報輪播,免費的噢。

工具/原料

Photoshop軟體,一切可以用來編輯圖片的軟體都可以呢。。
當然還要有個淘寶店鋪

方法/步驟

用ps製作寬度為1920px的高度500px的海報。製作兩張或者兩張以上,當然一張也是沒有問題的,就是看不出輪播效果。。哈哈

將圖片上傳至圖片空間

新建一個文本文檔(也可以用dreamweaver新建一個htm文檔),粘貼以下代碼。

在空白文檔里粘貼以下代碼

<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="http://img04.taobaocdn.com/imgextra/i4/113535006/TB2S4eFXVXXXXX6XpXXXXXXXXXX_!!113535006.png" /></div>

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

<img data-ks-lazyload="http://img01.taobaocdn.com/imgextra/i1/113535006/TB2Li5HXVXXXXbIXXXXXXXXXXXX_!!113535006.png" /></div>

</div>

<div class="first1365065449925trigger" style="margin: 0px; padding: 0px; width: 1366px; 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="http://chenruimy.tmall.com/?&amp;&amp;scene=taobao_shop" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="http://img02.taobaocdn.com/imgextra/i2/113535006/TB2DhCFXVXXXXc8XXXXXXXXXXXX_!!113535006.jpg" width="11920" /></a></li>

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

<a href="http://chenruimy.tmall.com/?&amp;&amp;scene=taobao_shop" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="http://img02.taobaocdn.com/imgextra/i2/113535006/TB2DhCFXVXXXXc8XXXXXXXXXXXX_!!113535006.jpg" width="1920" /></a></li>

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

<a href="http://chenruimy.tmall.com/?&amp;&amp;scene=taobao_shop" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="http://img02.taobaocdn.com/imgextra/i2/113535006/TB2DhCFXVXXXXc8XXXXXXXXXXXX_!!113535006.jpg" width="1920" /></a></li>

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

<a href="http://chenruimy.tmall.com/?&amp;&amp;scene=taobao_shop" style="margin: 0px; padding: 0px;" target="_blank"><img border="0" data-ks-lazyload="http://img02.taobaocdn.com/imgextra/i2/113535006/TB2DhCFXVXXXXc8XXXXXXXXXXXX_!!113535006.jpg" height="500" width="1920" /></a></li>

</ul>

</div>

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

<li>

&nbsp;</li>

<li>

&nbsp;</li>

<li>

&nbsp;</li>

<li>

&nbsp;</li>

</ul>

</div>

</div>

從圖片空間複製相應的圖片的連結,替換以上代碼中的圖片地址。圖片的連結網址也替換城你自己的連接地址。

替換完畢,打開淘寶店鋪,點擊店鋪裝修,添加自定義模版,編輯自定義模版,點擊代碼模式,將剛才編輯完的整段代碼複製到代碼框裡,點確定、發布,大功告成

相關文章

  1. 淘寶全屏輪播海報製作方法以及代碼

    有些淘寶朋友可能買的是簡易的模版,或者是為了省錢,不去買裝修模版,只是用官方默認的,這時的問題就來了,簡易的和官方的都是超簡單,沒 方法/步驟 要實現大海報的輪播 不要顯示 粘貼代碼 <div ...
  2. 怎麼製作淘寶全屏輪播海報(圖解)

    簡單細緻的介紹怎樣製作淘寶店鋪全屏輪播海報,小賣家也可以免費製作高大上的海報了,讓店鋪瞬間升級喲... 方法/步驟 登陸千圖網,搜尋"淘寶全屏輪播海報",尋找自己所要的素材模板. ...
  3. 淘寶全屏輪播海報代碼

    我們看到很多淘寶店的首頁海報都是全屏的,這種海報是怎麼做出來的呢?下面讓我們一起來看看吧! 工具/原料 PS 淘寶店鋪 步奏 選擇好自己要放在首頁的海報(一般兩張就可以了) 把要上傳到首頁的海報上傳到 ...
  4. 店鋪首頁裝修之全屏輪播海報製作

    看到很多朋友還在找店鋪首頁全屏輪播海報的教程,特意在此分享一下我的"裝修經".看完後一定要讓自己的店鋪變大高端大氣上檔次哈 (*^__^*) 嘻嘻--分享一個製作海報的網站,進去之 ...
  5. 淘寶全屏輪播代碼如何設置的簡單方法

    代碼沒有多複雜,多實驗幾回就能理解這段代碼的意思了,就不相信說明了,替換代碼中的中文就可以用,實現簡單的全屏輪播代碼 準備工作 然後將下列代碼進行編輯,如:"圖片地址1"在淘寶圖片 ...
  6. 2018 最新智能版淘寶全屏輪播

    淘寶裝修智能版更新有不少時間了,但還是有不少人不會用.(智能版是信譽不足一鑽免費使用) 工具/原料 淘寶網 方法/步驟 打開淘寶網址,單機出售中的寶貝 單機店鋪管理下的裝修店鋪 打開淘寶旺鋪(智能版) ...
  7. 淘寶專業版全屏輪播海報免費製作

    淘寶店鋪來個全屏海報無疑是特別棒的,但是幾乎所有的製作軟體都是要花錢的,這裡給大家教如何自己製作全屏海報輪播. 工具/原料 ps 淘寶店鋪 方法/步驟 找到喜歡的圖片,用ps製作成為寬度為1366的高 ...
  8. 淘寶首頁「全屏輪播」海報裝修方法

    在這大眾創業的大時代背景下,低門檻的淘寶店鋪成為了很多人的選擇:在這追求大的時代背景下,很多電腦顯示解析度也都做到了1920ppi,淘寶官方950ppi寬度的模板又會使得我們寄予厚望的店鋪看起來不夠高 ...
  9. 淘寶店鋪首頁全屏輪播圖製作

    很多朋友都想要做全屏輪播圖,接下來我來說說我的經驗 工具/原料 美圖秀秀 方法/步驟 1.首先要製作或者搜尋圖片寬度1920高度610的高畫質圖片 2.上傳到淘寶圖片空間,並複製其連接 3.將複製的連 ...
  10. 教你免費設計淘寶店鋪基礎版全屏輪播海報

    經過店主的苦心經營,淘寶小店好不容易上了鑽,但是問題就隨之而來,掌柜們是不是發現了店鋪裝修變回了旺鋪基礎版,不再是免費的專業版,想要升級一個月要支付60元.呵呵,為了給大家節約開支,我就教大家學會自己 ...
  11. 進來都會製作淘寶寬屏輪播圖

    越來越多的淘寶賣家在追求店鋪的美觀  而淘寶自身只有950*600的  但是很多賣家的輪播圖卻是寬屏輪播圖  下面來分享一下我的製作過程吧 工具/原料 製作三張1920*600的或者是1440*500 ...
  12. 全屏輪播海報設計分享

    現在的淘寶店鋪對設計的要求是越來越高了,以前能做到通欄就不錯了,現在不僅能通欄了,還能全屏輪播,有人問什麼是通欄呢?如下圖 通欄 這是兩欄現在我們要做是全屏輪播海報看效果 下面跟著我來做,先要了解全屏 ...
  13. 淘寶店鋪圖片輪播效果製作的詳細方法

    淘寶店鋪圖片輪播效果製作的詳細方法 方法/步驟 登錄後,單擊"賣家中心"然後在下圖中,選擇"店鋪裝修 在店招下方,找到自定義內容區,點擊"編輯" 如果 ...
  14. 輕鬆學會做天貓店鋪全屏海報+全屏輪播海報

    教你輕鬆學會做天貓店鋪全屏海報+全屏輪播海報 工具/原料 天貓 方法/步驟 全屏海報1920*600效果如圖 全屏輪播海報1920*600效果如圖 咋們想先用PS設計好圖片,好進入下一步驟 海報圖片 ...
  15. 怎麼裝修阿里巴巴旺鋪的「全屏輪播海報」

    阿里巴巴是B2B的商業模式,與淘寶是同一個公司旗下的平台,大多數商家會在阿里巴巴做批發或者是代理,那麼如何裝修阿里里的店鋪呢!下面小編將"全屏輪播"的裝修步驟分享給大家!GO-- ...
  16. 淘寶店鋪裝修之製作淘寶全屏海報輪播

    手把手教你如何製作全屏海報輪播. 工具/原料 電腦 方法/步驟 製作兩幅或者以上的全屏海報.長為1920像素,高的話隨意,但是幾幅圖片的高應該相同.一般的話是500或者550.如果你是代理,那麼就可以 ...
  17. 【淘寶特效代碼】製作旺鋪專業版全屏輪播教程

    一段特效代碼,輕鬆突破淘寶店鋪950的限制實現帶縮略圖的全屏輪播特效. 工具/原料 全屏輪播代碼 方法/步驟 登陸淘寶旺鋪專業版帳號,進入店鋪裝修後台. 在950自定義模塊下,添加模塊.新建一個自定義 ...
  18. 淘寶店鋪旺鋪專業版全屏輪播製作圖文教程

    本教程是針對那些沒有多少淘寶店鋪裝修經驗的小白們,一些小賣家自己開的店鋪,沒有太多資金花錢讓第三方服務來裝修自己的店鋪,但是自己對裝修用的代碼又不是很了解,下面這個教程詳細介紹了淘寶店鋪旺鋪專業版全屏 ...
  19. 怎麼樣製作淘寶或者天貓首頁全屏輪播效果

    我們在裝修淘寶或者天貓店鋪時,首頁輪播動畫效果製作都是比較麻煩的.一般都是寫代碼製作,但是能自己寫代碼,早就做碼農了,還做啥設計師,我這裡介紹一個傻瓜式的全屏輪播生成神器.我使用的是神碼裝修工具 工具 ...
  20. 淘寶店鋪裝修:全屏海報,全屏輪播,店招通欄

    給大家總結一些小賣家的常用店鋪裝修代碼,但很多賣家們都沒去了解店鋪裝修後台的版本,許多人也不知道:作為一鑽級以下的店鋪裝修後台是默認基礎版,可以免費使用專業版等我們到了一鑽以後,如果想要用專業版要花5 ...