淘寶旺鋪寶貝分類完美整體設計。不知道大家看到過沒有，有些漂亮的店鋪，首頁左側分類區是很完整的圖形哦，中間沒有任何分割空白。用管理后臺的填加分類然后換成圖片這種傳統方法是完全做不到的，那么他們是怎么做的呢？先看看我所說的效果：
怎么樣，很漂亮吧，你也想要嗎？聽俺慢慢道來~
首先寫下大體步驟，有設計經驗的朋友一看過程就明白了，就無需看下面比較啰嗦的部分了，不是很了解的朋友就繼續看下面的步驟。
1.準備工具Fireworks,Dreamweaver.
2.用FIREWORKS先做出圖片，切片，然后導出。
3.用Dreamweaver編輯代碼文件，為各分類圖片加對應鏈接。
4.到旺鋪后臺左側添加自定義區，粘帖編輯好的代碼，保存。
5.刪除旺鋪分類模塊。
6.預覽-發布，大功告成！
下面就是詳細的步驟了，說的比較詳細，啰嗦，主要是給新人看的。
準備工具我用的是Fireworks(以下簡稱FW),Dreamweaver(以下簡稱DW)。也可以用其他軟件代替，比如做圖用PS，編輯代碼用EditPlus之類的。
1.FW 做圖，切片導出。
首先打開FW，打開一幅自己想要做分類背景的圖片，建議圖案不要太復雜花哨(設計能力強的朋友可以新建空白文檔自己設計整體樣式)。截出自己想要做背景的部分，寬
度為200，高度隨意(根據自己分類多少自定)。【圖1】
【圖1】
2.在截出的部分上用文字工具打上自己的分類，上下排列整齊【圖2】。點擊切片工具，將每個分類分別切開【圖3】，最后導出【圖4】(導出后你到設定的文件夾里，會看到圖片被切成很多小圖片，還有個html的代碼文件【圖5】)。
【圖2】
【圖3】
【圖4】
【圖5】
3.把剛才導出的分類小圖片上傳到你的網絡相冊或者空間里面，一會要用。
4.打開剛才保存的目錄，用DW編輯剛才導出的html代碼文件.
5.【這步很重要】
點擊分類名稱的圖片，在源文件處填入對應圖片的網址【圖7】，就是第三步你傳到相、冊后得到的圖片網址【圖6】，必須的哦，否則最后圖片不顯示。然后到你的店鋪得到對應的分類地址(點擊分類名稱，然后復制瀏覽器地址欄里的地址)，在下面鏈接處黏貼網址【圖7】，依次為全部圖片添加上對應的圖片地址以及分類鏈接。這步很關鍵，圖片必須對應，分類網址也必須對應，建議一個圖片接一個圖片的來。頂部以及底部有裝飾類的圖片的話，就只給換上圖片網址就行，無需加鏈接了。
【圖7】
【圖6】
6.復制(拷貝)代碼中<table 與</table>中間的代碼，這些是我們所需要的【圖8】。或者你可以在下面設計區移動鼠標在圖片周圍，當鼠標變
的時候，點擊一下，就選取了我們所需要的代碼，然后到上面代碼反選區右鍵，拷貝就行了。【圖10】
【圖8】
【圖10】
7.進入旺鋪后臺，在左側添加自定義模塊【圖11】，到左側最下面找到新添加的模塊，點擊齒輪圖標進行編輯，切換到源碼模式，黏貼上一步中復制好的代碼【圖12】。取消源碼模式，你就會看到效果了，最后保存。
【圖11】
【圖12】
8.返回后臺首頁，剛才添加的模塊位于最下面，點擊模塊上的向上按鈕，將它提升到原有分類的上面。
9.在后臺管理首頁，點擊內置原有分類模塊上的叉號，將此模塊刪除。不要害怕哦，刪除后只有在首頁不顯示，進入分類，查看寶貝圖片頁面還是顯示內置分類的。我們只是將首頁的內置分類模塊刪除了，而且如果想要找回，重新添加模塊，添加：店鋪模塊，就回來啦。
10.預覽店鋪，你就看到效果了，怎么樣，很不錯吧？點擊各分類圖片，看看有沒有對應錯誤的，一切正常的話，就可以發布您的店鋪了，這時所有人都可以看到您新做的寶貝分類樣式了！最后效果：
重點總結：
1.在制作圖片時，背景盡量不要太花哨，容易看不清分類的文字。頂部底部的圖片可以有不同的裝飾，但是中間分類圖片背景圖片最好是統一的，或者有幾個同樣背景的就行，便于以后添加新分類。如果是復雜一體的圖片，以后往中間插其他分類時，就會破壞整體圖片，不協調。
2.切片時避免每個圖片太大，影響店鋪打開速度，不要考驗買家的耐心哦~
3.DW 編輯代碼的步驟，一定要吧圖片對應的地址，以及對應的分類鏈接填寫正確，否則最后就容易出現圖片不顯示，重復，對應分類混亂等錯誤。
4.最后制作完畢新分類模塊后，記得刪除原模塊，否則就重復。
5.注意，這樣制作完后，僅僅是更換了首頁的分類顯示方式，進入分類，查看寶貝的頁面里，左側顯示的都還是系統內置的，就是原來的分類樣式。
店鋪就是臉面，我們都需要以盡可能美麗的臉面來迎接每一位顧客，所以希望這篇帖子能給大家帶來幫助，都能打造出個性十足的分類，推動店鋪旺旺旺！
樂發網超市批發網提供超市貨源信息,超市采購進貨渠道。超市進貨網提供成都食品批發,日用百貨批發信息、微信淘寶網店超市采購信息和超市加盟信息.打造國內超市采購商與批發市場供應廠商搭建網上批發市場平臺,是全國批發市場行業中電子商務權威性網站。
本文來源： 淘寶旺鋪寶貝分類完美整體設計
