對(duì)于我們個(gè)人小店來(lái)說(shuō),升鉆以后每月50塊的旺鋪專業(yè)版費(fèi)用外加死貴的裝修模板費(fèi)用是筆不小的支出,本著能省則省的指導(dǎo)方針,本人花了好長(zhǎng)一段時(shí)間上網(wǎng)搜集資料并自己摸索實(shí)踐,整理出一整套的裝修代碼,零基礎(chǔ)的都可以很快學(xué)會(huì)。發(fā)這個(gè)貼的目的是發(fā)揚(yáng)分享精神、廣結(jié)淘寶好友。有看不明白,或者在實(shí)際裝修中遇到問(wèn)題的,或者有更好的裝修方法的,可以聯(lián)系我(旺旺ID:angelawujinyan);對(duì)于實(shí)在學(xué)不會(huì)的,我可以抽空幫忙免費(fèi)裝修。廢話不多說(shuō),咱們正式開(kāi)始……
目錄:
一、店招
二、全屏店招背景
三、修改導(dǎo)航條顏色
四、制作首頁(yè)全屏輪播海報(bào)/通欄海報(bào)
五、裝修首頁(yè)寶貝推薦
一、店招
1、準(zhǔn)備一張尺寸為:950*120 px的店招圖片,并上傳到圖片空間
2、找到店鋪的收藏鏈接(店鋪首頁(yè)——在“收藏店鋪”上右擊鼠標(biāo)——拷貝鏈接)
3、在店鋪裝修頁(yè)面的“店招”處點(diǎn)擊“編輯”,添加圖片及圖片鏈接,圖片鏈接中輸入店鋪的收藏鏈接,這樣顧客點(diǎn)擊店招時(shí),會(huì)自動(dòng)彈出收藏店鋪的頁(yè)面(當(dāng)然你也可以在店招鏈接某個(gè)活動(dòng)、某個(gè)商品的頁(yè)面)。
二、全屏店招背景
(一)純色背景
1、“樣式管理”——“選擇配色”,選擇你要的背景色。
2、“樣式管理”——“選擇配色”,勾選顯示頁(yè)頭背景
(二)非純色全屏背景(我用的是這種)
1、制作一張1920*150的店招背景圖片(其中最底下30像素為導(dǎo)航條背景顏色),將圖片上傳圖片空間(我的做法是,PS一張1920*150的店招+店招背景的圖片,OK后,再?gòu)闹薪厝〉暾?,這樣店招和店招背景可以整合得比較好)
2、在“是否顯示頁(yè)頭背景圖”里,把勾取消掉,并點(diǎn)擊“保存”
3、店招背景裝修代碼,將以下紅色字體替換成圖片空間里店招背景的地址
body{background-image:url(http://img02.taobaocdn.com/imgextra/i2/97633033/T2cMzSXNBXXXXXXXXX_!!97633033.jpg);background-repeat:repeat-x;background-position:top center;background-attachment:scroll;background-position:center 114px;}
4、在CSS里添加代碼:在店鋪裝修頁(yè)面的“導(dǎo)航欄”處點(diǎn)擊“編輯”——顯示設(shè)置,將以上代碼保存到CSS里。
PS:這種方法只有首頁(yè)可以看到背景,詳情頁(yè)看不到,目前還沒(méi)找到解決的方法,后續(xù)找到了再補(bǔ)充上來(lái),也歡迎各位親們幫忙補(bǔ)充。
三、修改導(dǎo)航條顏色
如果覺(jué)得導(dǎo)航條顏色和店招顏色不搭,想要修改,可以在網(wǎng)上生成導(dǎo)航條代碼,然后同設(shè)置店招背景一樣,把生成的代碼添加到CSS即可。
(百度“導(dǎo)航條代碼生成”,有好多這種網(wǎng)站,為了避免廣告的嫌疑,這里就不把網(wǎng)址貼上來(lái)了。)
Tips: 當(dāng)你想把導(dǎo)航條修改為某個(gè)顏色,但是又不知道這個(gè)顏色的RGB值時(shí),可以把這個(gè)顏色的圖片截圖到PS,從PS查詢(相信會(huì)一點(diǎn)PS的都懂的吧)。
四、制作首頁(yè)全屏輪播海報(bào)/通欄海報(bào)
1、制作全屏輪播海報(bào)圖片(我的店鋪是三張 1280 * 480的)
2、因?yàn)榛A(chǔ)版的模塊分了左右兩邊,沒(méi)有通欄的自定義模塊,所以要使用通欄代碼:以下是我店鋪的從左向右的通欄代碼,您需要將以下紅色字體替換成您圖片空間地址,及對(duì)應(yīng)鏈接的頁(yè)面地址后,放到左邊的裝修模塊里(注意,是左邊,在左邊添加一個(gè)自定義模塊,保存后看不到通欄效果,一定要點(diǎn)擊發(fā)布后查看效果)
<div class="J_TWidget" data-widget-config="{"effect": "fade", "circular": true ,"navCls":"toseise","activeTriggerCls":"odslos","contentCls":"piaofu"}" data-widget-type="Tabs">
<div class="piaofu" style="height:480px;">
<div data-widget-config="{
"contentCls": "slide-kun1362899830209content",
"triggerCls": "slide-kun1362899830209triggers",
"navCls": "slide-kun1362899830209triggers",
"triggerType": "mouse",
"effect": "scrollx",
"prevBtnCls":"prev",
"nextBtnCls":"next",
"steps": 1,
"autoplay": true,
"viewSize":[1280],
"circular": true
}" data-widget-type="Carousel" class="J_TWidget" style="z-index:10;top:0px;left:-165px;padding:0px;margin:0px;width:1280px;">
<div class="J_TWidget" data-widget-config="{"trigger":".first-trigger2","align":{"node":".first-trigger2","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://img01.taobaocdn.com/imgextra/i1/1578214660/T2kx56XcNbXXXXXXXX-1578214660.png" />
</div>
<div class="next" style="width:90px;height:90px;margin-left:950px;">
<img src="http://img04.taobaocdn.com/imgextra/i4/1578214660/T2bMh6XehdXXXXXXXX-1578214660.png" />
</div>
</div>
<div style="height:500px;width:1280px;overflow:hidden;padding:0px;margin:0px;" class="first-trigger2">
<ul class="slide-kun1362899830209content" style="height:500px;width:1280px;padding:0px;margin:0px;">
<li style="width:1280px;height:500px;padding:0px;margin:0px;list-style-type:none;">
<a target="_blank" style="padding:0px;margin:0px;" href="http://sanmaobb.taobao.com/category-857784465.htm?spm=2013.1.w5002-1352266626.4.A9AdSc&search=y&catName=2014%B4%BA%D7%B0%D0%C2%C6%B7&scene=taobao_shop"><img width="1280" height="500" border="0px" src="http://img03.taobaocdn.com/imgextra/i3/97633033/T2XPPlXuXaXXXXXXXX_!!97633033.jpg" /></a>
</li>
<li style="width:1280px;height:500px;padding:0px;margin:0px;list-style-type:none;">
<a target="_blank" style="padding:0px;margin:0px;" href="http://item.taobao.com/item.htm?spm=a1z10.5.w4002-1352266651.54.hzOLOQ&id=37216976370&scene=taobao_shop"><img width="1280px" height="500px" border="0px" src="http://img04.taobaocdn.com/imgextra/i4/97633033/T24.rlXq0aXXXXXXXX_!!97633033.jpg" /></a>
</li>
<li style="width:1280px;height:500px;padding:0px;margin:0px;list-style-type:none;">
<a target="_blank" style="padding:0px;margin:0px;" href="http://item.taobao.com/item.htm?spm=a1z10.5.w4004-5126785464.2.hzOLOQ&id=36577942828&scene=taobao_shop"><img width="1280px" height="500px" border="0px" src=" http://img01.taobaocdn.com/imgextra/i1/97633033/TB2pgRmaXXXXXaeXXXXXXXXXXXX_!!97633033.jpg " /></a>
</li>
</ul>
</div>
<ul class="slide-kun1362899830209triggers" style="padding:0px;margin:0px;display:none;">
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
</ul>
</div>
</div>
</div>
想在淘寶這個(gè)大平臺(tái)生存下去,離不開(kāi)努力和堅(jiān)持,所謂一分耕耘一分收獲,沒(méi)有付出是沒(méi)有收獲的,做賣家就要承受常人所不能承受的艱苦,要在競(jìng)爭(zhēng)中脫穎而出肯定得有自己的特色,產(chǎn)品沒(méi)有特色就要在服務(wù)上跟上,用自己的長(zhǎng)處來(lái)彌補(bǔ)不足,得學(xué)會(huì)忍耐寂寞,而且還要學(xué)會(huì)銷售技巧,還要學(xué)會(huì)自己推廣。這不是單憑滿腔熱情就能取勝的。不過(guò)既然選擇做淘寶了,就必須有良好的心態(tài)迎接淘寶給我們考驗(yàn)!我是個(gè)新人,開(kāi)店也沒(méi)多久,現(xiàn)在正努力推廣中,我堅(jiān)信:風(fēng)雨過(guò)后會(huì)一定會(huì)有彩虹。一起努力哦,加油
五、裝修首頁(yè)寶貝推薦
方法一:直接添加后臺(tái)自帶的“寶貝推薦”模塊
優(yōu)點(diǎn):簡(jiǎn)單
缺點(diǎn):沒(méi)辦法通欄,寬度只有750,而且要按淘寶的順序排序。
方法二:用PS和Dreamweaver做一個(gè)頁(yè)面
優(yōu)點(diǎn):可以完全按自己的想法布局頁(yè)面及展現(xiàn)寶貝。
缺點(diǎn):需要懂一些些PS和Dreamweaver
1、把你想要展現(xiàn)的頁(yè)面PS成一整張大圖;
2、在PS里切片成若干張小圖(因?yàn)橐徽麖埓髨D,打開(kāi)頁(yè)面太慢),并保存成圖片和頁(yè)面
另,不會(huì)PS的親,可以去淘寶大學(xué)搜索一下裝修課程,只要花個(gè)十幾分鐘學(xué)會(huì)如何把寶貝圖片拖到PS,如何在PS里切片就可以;想要學(xué)習(xí)PS其它更多技巧的,這里推薦劉青老師的《oeasy教你玩轉(zhuǎn)ps》教程,講得很詳細(xì),也很幽默,我就是看他的視頻學(xué)會(huì)的,“百度課程”里有一整套的視頻
3、把切出來(lái)的圖片上傳圖片空間
4、用Dreamweaver打開(kāi)剛生成的頁(yè)面,把所有圖片地址替換成圖片空間地址,并加上商品鏈接。
5、通欄代碼:
不知道為什么這段代碼一直發(fā)布不成功,只能用圖片形式了,需要代碼的可以旺旺聯(lián)系我。
但是我一般只有晚上在線,您也可以 把前面幾個(gè)代碼拿到百度里面去搜索一下,可以搜索到完整的哦
6、在裝修頁(yè)面的左側(cè)添加一個(gè)自定義模塊,把以上代碼拷貝進(jìn)去即可。
差不多就這些了,完成以上步驟,您的店鋪看上去應(yīng)該會(huì)很不錯(cuò)的。
最后,祝各位親們生意興??!
聯(lián)系客服