需要用到切片和代碼的一般有兩個(gè)軟件，一個(gè)是photoshop，另一個(gè)是dreamwear ，下面教程的展示是CS6版本的。 　　一、首先說(shuō)一下photoshop的使用吧！

　　1）先切圖，用最簡(jiǎn)便的方式在圖片上面拉出參考線，如下圖

　　2）選擇切片工具

　　3）選擇基于參考線切片 

　　4）選擇基于參考線切片之后效果如下： 

　　5）選擇切片選擇工具：

　　選擇第一個(gè)切片的時(shí)候會(huì)出現(xiàn)黃色的邊框，然后按著Shift選擇第二個(gè)切片，同時(shí)出現(xiàn)黃框，之后右鍵出現(xiàn)組合切片，完成組合。

　　完成組合之后效果如下：

　　現(xiàn)在切片都切好并且按著自己的方式已經(jīng)組合完畢，就可以導(dǎo)出圖片和代碼文件了。選擇文件，儲(chǔ)存為web格式：

　　選擇所有切片，并且格式設(shè)置為jpg，若需要透明圖片的話可以選擇png格式，質(zhì)量80即可。

　　設(shè)置如下圖所示：

　　文件名盡量設(shè)置一個(gè)可以識(shí)別的，有意義的名字，格式選擇html和圖像，切片選擇所有切片，之后點(diǎn)擊保存即可。

　　images里面的圖片就是咱們剛才切的圖。

　　到這里photoshop已經(jīng)用完了，下面就開(kāi)始使用dreamwear來(lái)編輯代碼。

　　先登錄淘寶賬號(hào)進(jìn)入賣家中心點(diǎn)擊圖片空間上傳圖片

　　選擇適合自己的圖片上傳方式上傳圖片。

　　點(diǎn)擊立即上傳即可。上傳之后就是使用dreamwear代碼了。

　　打開(kāi)之前生成的html文件

　　選擇其中的圖片，在下面屬性里面看到如圖效果（如果沒(méi)有出現(xiàn)屬性，可以在視圖里面找到屬性點(diǎn)擊即可）

　　之后進(jìn)入淘寶圖片空間找到對(duì)應(yīng)圖片，點(diǎn)擊鏈接

　　現(xiàn)在已經(jīng)給圖片地址復(fù)制下來(lái)了。然后進(jìn)入dreamwear給地址粘貼到屬性下面地址當(dāng)中，如圖所示：

　　這個(gè)就給圖片換好了，其他圖片也是一樣的步驟。如果需要給圖片加鏈接，在屬性里面那個(gè)鏈接的地方添加需要添加的鏈接即可。這些都添加完成之后在dreamwear　　中點(diǎn)擊代碼模式，給里面的代碼全部復(fù)制下來(lái)。 

　　之后進(jìn)入淘寶后臺(tái)店鋪裝修頁(yè)面，在自定義模塊里面點(diǎn)擊源碼方式，給剛才復(fù)制的代碼粘貼上面即可。