偶然看到一個淘寶商城的寶貝分類做的很漂亮~而且是放在店鋪中間的自定義位置~背景是很漂亮圖片~分類一目了然,而且圖片背景和店鋪的整體裝修風格融為一體,特別漂亮~所以就自己動手做了個寶貝分類的圖片!
在這里和大家一起分享下整個的制作過程~
這個教程一共要用到兩個編輯軟件:Photoshop cs2 9.0和Dreamweaver 8 編寫的整個制作過程,相信沒有用過這兩個軟件的朋友也會很容易學會的~希望的這次付出可以幫到更多的朋友~另外的領一篇帖子“新手必看-如何制作漂亮的店鋪和詳情頁左側欄推廣寶貝”確實幫到了一些朋友~這些朋友的鼓勵也是寫這篇帖子的動力~再次感謝他們!
好了下面開始我們的制作之旅吧~
一:首先打開我們的Photoshop,新建一個圖像 尺寸為:900xp 278xp(的這個分類是放在通欄自定義頁的,如果大家想放在店鋪首頁的話,尺寸要做成寬度:750的) 分辨率為72 顏色模式RGB 8位 背景內容 白色 如下圖:
二:背景圖片的制作:首先在百度圖片里面找一張你想做分類背景的圖片,然后下載保存,這里已經準備好了一張,然后就直接把這張圖片放到photoshop里面編輯了~
1:在photoshop里打開我們準備好的圖片~
這是準備的圖片:我們把這張圖片拖到我們新建那個對象中~方法是鼠標左鍵點住直接拖到新建的背景中就可以了~然后把圖像調整成合適的大小就可以了~調整方法:ctrl+t 然后自己拖拉就可以了~
這是PHOTOSHOP里打開的狀態
2:下面我們要做的就是在這張圖片上把我們的寶貝分類文字打上去:
點擊工具欄長條上面的一個“T”工具,然后在圖片上要添加文字的地方點擊一下,然后鍵盤輸入文字就可以了~
展示下我做的
3:文字打好之后~我們把編輯好的圖片合并圖層,方法是在photoshop的頂部工具欄里有個圖層,
合并好圖層,下面我們要做的就是保存圖片,儲存為JPG圖像,記住你儲存的位置哦~
三:背景圖片上傳的圖片空間:打開你的淘寶圖片空間,把做好的圖片上傳到你的圖片空間~
上傳后是這個樣子的:
圖片上傳好了之后,我們要把這個圖片的鏈接復制下來,點擊圖片的鏈接就復制好了~
四:我們打開:Dreamweaver 8 新建一個HTML
然后我們先在建好的HTML里布局個表格~點擊上面的布局,然后點布局表格~記住表格的尺寸就是你準備好的圖片的尺寸900 278 的
在布局好的表格里面,我們來布置個單元格 尺寸也是900 278的
五:在布局好的 單元格里插入圖像~這個圖像就是我們做好的圖片
點擊上面的“插入”“圖像”然后就出現了上面的那張圖~在這里我們剛才復制的圖片空間的圖片地址就要用到了~
在我用紅框框起來的地方粘帖你復制的圖片地址,然后一直確定就OK了~
五:給圖片添加熱區,熱區的意思就是這個地方可以插入鏈接,你一點這個地方就會打開你添加鏈接的地址~
添加熱區的方法是:點擊上圖中地圖下面的長方形,然后在你的分類文字上點住左鍵拉一下就會出現如上圖的連衣裙上得框子,然后在下面鏈接的地方:填上你的寶貝分類中連衣裙的網絡地址就OK了~
下面我們依次按照上面的方法把其他的熱區都做好~鏈接都添加好~
這樣我們的自定義分類就做好了~
六:安裝代碼:
1:在Dreamweaver 8中把你做好的HTML 代碼復制下來
2:打開我們的淘寶店鋪:點擊店鋪裝修 然后在做下面 添加自定義模板
3:編輯自定義模板,把我們復制的代碼粘帖到里面,保存就可以了~
4:發布我們的裝修就OK了~
樂發網超市批發網提供超市貨源信息,超市采購進貨渠道。超市進貨網提供成都食品批發,日用百貨批發信息、微信淘寶網店超市采購信息和超市加盟信息.打造國內超市采購商與批發市場供應廠商搭建網上批發市場平臺,是全國批發市場行業中電子商務權威性網站。
本文來源: 教你如何做淘寶裝修自定義的寶貝分類